设置的warp宽度，在火狐中下面的盒子都不管用，需要每个大盒子都设置1000px，怎么回事？
来源：-
刘景照
2014-11-21 21:28
css
/*公共样式*/
/*浮动*/
.fl{float:left;}
.fr{float:right;}
body{background: #F5F5F5;font-family: "宋体"；}
#top{width:100%;height:27px;background:url(../images/top_bg.jpg) repeat-x;}
.topText{width:1000px;height:27px;margin:0 auto;}
.topText ul li{font-size:15px;float: right;list-style-image:url(../images/arrow.jpg);
width:75px;height:27px;line-height:27px;margin-right: 3px;}
.topText a:link, .topText a:visited{color: #8E8E8E;};
.topText a:hover, .topText a:active {color: #C00;};
/*End top*/
.warp{width:1000px;margin:0 auto;}
.logo{width:1000px;margin:0 auto;height:80px;background:#FFF;}
.logoLeft{width:200px;height:80px;}
.logoRight{margin-top:30px;width:300px;font-size:15px;}
.logoRight img{vertical-align:middle;margin-right:10px;display:inline;}
.logoRight span{color:red;font-size:18px;font-weight: bold;}
/*End logo*/
.nav{width:1000px;margin:0 auto;height:40px;}
.navLeft{width:10px;background:url(../images/nav_left.jpg) no-repeat;}
.navMid{width:980px;line-height:40px;background:url(../images/nav_bg.jpg) repeat-x;}
.navRight{width:10px;background:url(../images/nav_right.jpg) no-repeat;}
.navLeft,.navMid,.navRight{float:left;height:40px;display:inline;}
.navMidLeft li{float:left;width:100px;text-align:center;font-size:17px;}
.navMidLeft li a:link,.navMidLeft li a:visited{color: white;}
.navMidLeft li a:hover,.navMidLeft li a:active{color:yellow;}
.search{width:190px;height:20px;margin-top:9px;margin-left:20px;
background: url(../images/search.jpg) no-repeat right center;
background-color:#FFF;border:1px solid #FFF;padding-left:5px;
padding-right:25px;}
/*End nav*/
.ad {width:1000px;margin:0 auto;height:320px;margin-top:5px;overflow:hidden;}
/*End ad*/
html
<body>
<div id="top">
<div class="topText .clearfix">
<ul>
<li><a href="#">联系我们</a></li>
<li><a onclick="AddFavorite(window.location,document.title)" href="javascript:void(0)">加入收藏</a></li>
<li><a onclick="SetHome(window.location)" href="javascript:void(0)">设为首页</a></li>
</ul>
</div>
</div>
<!-- End top -->
<div class="warp">
<div class="logo clearfix">
<div class="logoLeft fl"><h1><a href=""><img src="images/logo.jpg" alt="慕课网" class="logoLeft fl" /></a></h1></div>
<div class="logoRight fr"><img src="images/tel.jpg" alt="联系电话"/>24小时服务热线：<span>123-456-7890</span></div>
</div><!-- End logo-->
<div class="nav">
<div class="navLeft"></div>
<div class="navMid">
<div class="navMidLeft clearfix">
<ul>
<li><a href="#">首页</a></li>
<li><a href="list.html">关于慕课</a></li>
<li><a href="list.html">新闻动态</a></li>
<li><a href="list.html">课程中心</a></li>
<li><a href="list.html">在线课程</a></li>
<li><a href="list.html">人才招聘</a></li>
</ul>
</div>
<!--navMidLeft-->
<div class="navMidRight">
<form action="" method="post">
<input type="text" class="search" />
</form>
</div>
<!--navMidRight-->
</div>
<!--navMid-->
<div class="navRight"></div>
</div><!-- End nav -->
<div class="ad">
<div id="boxID"><!--焦点图盒子-->
<div class="loading"><img src="images/loading.gif" alt="请稍候..." /></div>
<!--载入画面(可删除)-->
<div class="pic"><!--内容列表(li数目可随意增减)-->
<ul>
<li><a href="#"><img src="images/ad2.jpg" thumb="" alt="" text="详细描述2" /></a></li>
<li><a href="#"><img src="images/ad3.jpg" thumb="" alt="" text="详细描述3" /></a></li>
<li><a href="#"><img src="images/ad4.jpg" thumb="" alt="" text="详细描述4" /></a></li>
<li><a href="#"><img src="images/ad3.jpg" thumb="" alt="" text="详细描述5" /></a></li>
</ul>
</div>
</div>
</div>
<!--End ad-->
</div><!-- End warp-->
写回答
关注
0回答
还没有人回答问题，可以看看其他问题
企业网站综合布局实战
本课程重点介绍HTML/CSS实现常见企业网站布局的方法
157042 学习 · 1984 问题
相似问题