希望有人可以提供建议
在横向模式(480px)的平板设备上重复我的页脚包装有问题
HTML
<div id="footer-wrap">
<footer class="footer-inner">
<section class="foo1">
<h1>Get in Touch</h1>
<hr>
</section>
</footer>
</div>
CSS
#footer-wrap {
background: none repeat #373737;
min-height: 400px; }
.footer-inner {
width: 940px;
margin: 0 auto; }
在我的头脑中
最初我没有在媒体查询中定位#footer-wrap,因为我认为因为它只包含BG颜色而没有其他属性,所以从主样式表拉出就足够了
我尝试在媒体查询中添加
@media only screen and (min-width: 480px) and (max-width: 767px){
#footer-wrap {
width: 100%; /*with the intention of just filling the div*/
}
}
也试过
#footer-wrap {
width:767px;
background: none repeat #373737;
}
两者都没有效果
任何人都可以提出建议,我确信答案会让我感到震惊,但是我不能让我的生活明白这一点,因为我正在这个项目上落后
非常感谢提前
约翰
答案 0 :(得分:0)
在媒体查询中: -
@media (max-width: 767px){
#footer-wrap{
margin-left: -20px;
margin-right: -20px;
} }
答案 1 :(得分:0)
我想我可能会添加如何完全解决,如果不是为了关闭,但也许可以帮助其他人
页脚容器需要最小宽度100%
这就是...... 3个血腥的小时,而这就是它所需要的一切
可能会帮助那些和我一样迷茫的人
问题已完全解决并完成
R
约翰