开发者

CSS: Container does not stretch to 100% width

开发者 https://www.devze.com 2023-01-18 01:45 出处:网络
http://jsbin.com/uqafo4 Please check the white area: it should go all the way, as I used wi开发者_运维百科dth: 100%, but it doesn\'t.

http://jsbin.com/uqafo4

Please check the white area: it should go all the way, as I used wi开发者_运维百科dth: 100%, but it doesn't.

#container {
    background-color:#FFF;
    background-position:center bottom;
    background-repeat:no-repeat;
    height: 440px;
    width: 100%;
}


By default the body tag in some browsers have a margin set on them in the User Agent (default) stylesheet. Simple use

body { margin: 0; }

to remove this margin. You should also consider using a reset stylesheet, such as this one by Eric Meyer.


The problem is that the <body> element has some default area around there, add this to the body rule to be safe:

margin: 0;

You cant test the updated version here, no space :)


Following Yi Jiang's advice should solve your problem.

If you don't have a background-image, you can remove

background-position:center bottom;
background-repeat:no-repeat;

I would also suggest adding some padding, for example:

padding:10px;

but perhaps you're thinking about doing that already, only you haven't added the code yet. Or perhaps you don't want to use padding for some reason or another.

0

精彩评论

暂无评论...
验证码 换一张
取 消