DIV+CSS布局IE8和IE6的浮动层间距不同（）-HTML教程-爱易网页

DIV+CSS布局IE8和IE6的浮动层间距不同（）

日期：2014-05-17　浏览次数：20798 次

DIV+CSS布局IE8和IE6的浮动层间距不同（求助）
弄了很久了，间距总是调不正确，谁能帮忙看一下，谢谢了！

HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>文库</title>
<link rel="stylesheet" href="css/style.css" type="text/css"></link>
<script type="text/javascript">
<!--

//-->
</script>
</head>
  
  <body>
      <div class="top">
          <a href="#">daichangfu</a>&nbsp;欢迎登陆&nbsp;| <a href="#">我的文库</a> | <a href="">我的消息</a> | <a href="#">退出</a>
      </div>
    <div class="main">
        <div class="search">
            文档搜索
        </div>
        <div class="menu">分类导航</div>
        
        <div class="type">全部文档分类</div>

        <div class="right">
            <div class="right_x" style="height: 150px">公告</div>
            <div class="right_x" style="height: 300px">阅读排行榜</div>
            <div class="right_x" style="height: 300px">下载排行榜</div>
        </div>
        <div class="hot">热门推荐</div>
        <div class="type_x">详细分类</div>
        <div class="type_x">详细分类</div>
    </div>
    <div class="bottom">底部</div>
  </body>
</html>

CSS code

body{
    
}
.top{
    margin-right: 10px;
    /*border: 1px solid blue;*/
    text-align: right;
    font-size: 15px;
}
.bottom{
    margin: auto;
    margin-top: 10px;
    width: 1000px;
    height: 100px;
    border: 1px solid red;
    text-align: center;
}
.main{
    margin: auto;
    margin-top: 10px;
    width: 1000px;
    text-align: center;
}
.search{
    width: 100%;
    height: 75px;
    border: 1px solid blue ;
}
.menu{
    margin-top: 10px;
    width: 100%;
    height: 35px;
    border: 1px solid green;
}
.type{
    margin-top: 10px;
    width: 100px;
    height: 350px;
    float: left;
    background: green;
}
.hot{
    margin-top: 10px;
    margin-left: 110px;
    width: 650px;
    height: 350px;
    background: green;
}
.right{
    float: right;
    width: 230px;
}
.right_x{
    margin-top: 10px;
    width: 100%;
    background: green;
}
.type_x{
    margin-top: 10px;
    width: 760px;
    height: 350px;
    background: green;
}

------解决方案--------------------

HTML code



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文库</title>
<link rel="stylesheet" href="css/style.css" type="text/css"></link>
<style type="text/css">
<!--
body{}
.top{
    margin-right: 10px;
    /*border: 1px solid blue;*/
    text-align: right;
    font-size: 15px;
}
.bottom{
    margin: auto;
    margin-top: 10px;
    width: 1000px;
    height: 100px;
    border: 1px solid red;
    text-align: center;
}
.main{
    margin: auto;
    margin-top: 10px;
    width: 1000px;
    text-align: center;
}
.search{
    width: 100%;
    height: 75px;
    border: 1px so

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

DIV+CSS布局IE8和IE6的浮动层间距不同（）

相关资料更多>

推荐阅读更多>