zoukankan      html  css  js  c++  java
  • div中 table 宽度100% 浏览器兼容性

    代码结构:在div中放一个表格,div设置overflow:auto,table的宽度为100%。最好在这个div前放一个兄弟浮动的div,这样效果更明显。

    问题现象:

    当表格的内容比div的高度还要高时,div会出现竖直滚动条,同时在IE6和IE7下会出现问题:此时table的100%宽度还是没有滚动条那是的宽度,出现滚动条后,div的可视宽度减少,导致横向滚动条也出现了,而且横向能滚动的长度正好是滚动条的宽度。单在IE8下就不会出现这样情况。

    问题代码:

    <div style="float:left; height:200px; background-color:#060; 100px;">f</div>
    <div style=" overflow:auto;">
    <table border="1" style="table-layout:fixed;100%;">
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    .........
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    </table>
    </div>

    解决方法:内嵌套一个分区元素 Layout

    <div style="float:left; height:200px; background-color:#060; 100px;">f</div>
    <div style=" overflow:auto;">
    <div style="+zoom:1;">
    <table border="1" style="table-layout:fixed;100%;">
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    .........
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    </table>
    </div>
    </div>

  • 相关阅读:
    异步FIFO总结
    异常检测参考
    Java数据库连接技术
    Eclipse Decompiler不生效解决办法
    mysql常用操作
    时间序列预测——Tensorflow.Keras.LSTM
    AR(I)MA时间序列建模过程——步骤和python代码
    MySQL优化实例
    MySQL性能优化经验
    高性能MySQL笔记 第6章 查询性能优化
  • 原文地址:https://www.cnblogs.com/z_lb/p/3135301.html
Copyright © 2011-2022 走看看