CODEWITHSUNDEEP
htmlcssimage
piku
piku

Reputation: 285

how to set size of background image fit to the div

I want to set div background image div(w:932, h:148) and the image size is 1524*587
whan I trying to set it image is not getting fit to the div size what should i do? my code-

.header .logo { width:932px; height:148px; background:url(images/logo.jpg) no-repeat center;}

Upvotes: 6

Views: 28039

Answers (2)

Guffa
Guffa

Reputation: 700800

You can't resize a background image in the currently supported version of CSS (2.1).

You could layer elements on top of each other, so that you get an image element behind your content, but you should rather resize the actual image than doing it when displaying it. That would roughly reduce the file size to a fifth.

Upvotes: 0

BalusC
BalusC

Reputation: 1109635

You could use the CSS3 background-size property for this. 

.header .logo {
    background-size: 100%;
}

But then you still have the problem of wide (or not) browser support. Your best bet is then really to use a "plain vanilla" <img> element whose width/height is set to 100%.

Upvotes: 11

Related Questions