sanjeev
sanjeev

Reputation: 1407

CSS - Background image is being truncated

I want to set a non scrolling background image(1170x700) to an element() which is 1170px wide. For that I used following css

.container
{
    background:url("bg-image1170x700.gif") no-repeat fixed center top #fff;
}

PROBLEM :- Initially the image is being truncated and if I scroll down its displays correctly. Not sure what am I missing ?

Upvotes: 4

Views: 1607

Answers (2)

Rakesh Juyal
Rakesh Juyal

Reputation: 36749

You can use background-size:

.container
{
    background:url("bg-image1170x700.gif") no-repeat fixed center top #fff;
    background-size: contain;
}

Upvotes: 2

Barry Chapman
Barry Chapman

Reputation: 6780

You are displaying it fixed. It is most likely being hidden by another element, and when you scroll it scrolls out from behind that element

Upvotes: 1

Related Questions