一个div +table+css 的有关问题-HTML教程-爱易网页

一个div +table+css 的有关问题

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

一个div +table+css 的问题
我想实现一个表个放到div中然后宽度固定 div的高度固定如果table的高度随着 tr的增加而改变，那么div出现垂直滚动条，像如下效果：

这是除了IE 以外的浏览器的效果，是正确的
但是换成IE 效果就变成这样了：

外层的DIV 直接被撑开：

页面代码如下：

HTML code


<div class="ck_3">
            <div style="text-align:left;" class="sp">编组解析检查结果：<span id="bz_ckt" style="color:green; display:none">通过</span><span id="bz_ckf" style="color:red; display:none">未通过</span></div>
            <div class="ck3_tab_div">
            <table id="ck_3_tab" style="BORDER-COLLAPSE: collapse" borderColor="#000000"  cellPadding="1" align="center" border="1">
                
            </table></div>
        </div>

css如下：

CSS code


tr{
    width:45px;
}
td{
    padding-left:8px;
}
table{
  width:900px;
  height:40px;
  table-layout:fixed;
}
#ck_3_tab{
    font-size:15px;
    font-family:微软雅黑;
    font-weight:normal;
    font-style:normal;
    text-decoration:none;
    color:#000000;
    margin-top:3px;
}
.ck_3{
    margin-top:15px;
}
.ck3_tab_div{
    width:915px;
    height:150px;
    overflow-y:auto;
    overflow-x:hidden;
}

我分析了一下：就是在IE 中表格变大外层DIV出现滚动条之后虽然div宽度固定了但是 table的高度却把div撑开了

找了如下解决办法：设置table-layout:fixed; 但是在IE中还是无效？
什么情况呢？帮忙分析一下

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

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 type="text/css" rel="stylesheet" href="agreement.css" />
</head>
<body>
<div class="layout-wrap">
<div class="layout">
    <div class="agreement">
        
        <div class="inner">
          <div class="agreement-content">
asssssssssssssssssssssssssssssssssssssssssd
          </div>
        </div>
    </div>
</div>
</div>

</body>
</html>

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

图片挂掉了

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

一个div +table+css 的有关问题

相关资料更多>

推荐阅读更多>