Question

我有FIDDLE中显示的div，div内容与标题重叠，导致隐藏内容数据，即＆＃34;样本数据1＆＃34;。

<div id="header">
<div id="firstdiv">
    <table border="0px" width="100%" style="background-color:rgb(2, 44, 72)">
                        <tr>
                            <td id="test1" style="width:90%;" align="left">test

                            </td>
                        </tr>
                    </table>
</div>

</div>
<div id="content">
<table border="0">
    <tr>
        <td>Sample data 1
        </td>
    </tr>
    <tr>
        <td>Sample data 2
        </td>
    </tr>
    <tr>
        <td>Sample data 3
        </td>
    </tr>
    <tr>
        <td>Sample data 4
        </td>
    </tr>
</table>
</div>

// CSS 的#header { 位置：相对; } #firstdiv { 浮动：左;宽度：100％; 位置：绝对的; 白颜色; }

由于

Answer 1

从#firstdiv元素中删除绝对定位。左浮动也似乎没必要。

见这里：http://jsfiddle.net/k8Vut/2/

Answer 2

在标题中添加一些填充：http://jsfiddle.net/k8Vut/3/

   #header
   {
       padding-top: 25px;
   }

由于firstdiv是绝对的，它将从顶部开始：0位置，因此会覆盖相对定位的标题。因此，如果您添加一些填充，它会将标题移动到下方并为firstdiv

腾出空间

Div重叠的问题

2 个答案: