所以,我有:
<div class="wrapper">
<div class="full-width">
<div class="header">
<a href="">
<img src="img/logo.png" alt="Logo" class="logo img-responsive" />
</a>
<nav>
<ul class="nav nav-pills">
<li><a href="">Moden Web Design</a></li>
<li><a href="">Prices</a></li>
<li><a href="">Demonstration</a></li>
<li><a href="">Contact Us</a></li>
</ul>
</nav>
</div>
</div>
</div>
在<div class="wrapper">
内,width:1100px;
。所以问题是我是否可以以某种方式使div class="full-width"
具有全宽背景...因为它停在.wrapper
的边缘。
我尝试过这种方法,但它不起作用:
.full-width {
height:50px;
position:absolute;
width:100%;
z-index:100;
}
答案 0 :(得分:2)
我不知道你的整个代码,但这里是Fiddle
.full-width {
background: #333;
height: 50px;
position: absolute;
left: 0;
margin-top: 100px;
width: 100%;
z-index: 100;
}
答案 1 :(得分:0)
也许,你可以添加left:0px;
并再试一次。您也可以尝试使用负边距或宽度超过100%。我希望,这有帮助;)
答案 2 :(得分:0)
您可以使用
设置背景的大小background-size {
Xpx Ypx;
}
或者您可以尝试为全宽度容器提供背景信息。
答案 3 :(得分:0)
将您的CSS设置为max-width:100%; max-height:100%;