CODEWITHSUNDEEP
csshtml
nectar
nectar

Reputation: 9679

how to set background image size= 100% or stretch upto the full <div> background

my css code=

background:url(images/solu_bg.png) no-repeat left top;

but it not covering the whole div background area.why?

Upvotes: 0

Views: 2090

Answers (3)

jao
jao

Reputation: 18620

CSS3 has a property called background-size which you could use (however it's not fully supported by all browsers):

body {
    background-size: cover;
    -moz-background-size: cover; /* for Firefox */
}

there's more info at ALA

Upvotes: 1

Quentin
Quentin

Reputation: 944545

There is no way (except possibly using things proposed for CSS 3 that do not enjoy wide support) to scale background images (and browsers are pretty poor at scaling images anyway).

It is possible to fake it by absolutely positioning a foreground (content) <img> behind the content, but this is just an ugly hack (with some nasty side effects if, for example, the stylesheet isn't displayed and you get the image loaded inline with the content).

It is better to design your page to use single images (that can blend to a solid colour) or repeating images.

Upvotes: 0

Tim Goodman
Tim Goodman

Reputation: 23986

Here are some instructions for how to do this.

But as David Dorward says in his answer, it's an ugly hack.

Upvotes: 1

Related Questions