Question

我有一个1000px宽的页面，它在表格中保存输出，该表格比页面的其余部分宽得多。我没有水平滚动来读取所有数据的问题，但是像页眉和页脚一样的周围div的背景不会重复大表。

我读了一些关于将“display：inline-block”添加到大表周围的div的提示，但我还没有找到解决方案。

非常感谢帮助。

<div id="top_ad">
</div>
<div id="header">
</div>
<table>
THIS IS THE HUGE TABLE
</table>
<div id="footer">
</div>

标题div的背景重复出现，因为我将图像设置为BODY的背景而不是“标题”div。然而，“top_ad”和“footer”div的背景停在1000px。我的CSS下面是：

body {
background:url(/images/header_background_repeat.jpg) repeat-x 0 110px;
padding:0;
margin:0;
font-family:Arial, Helvetica, sans-serif;
font-size: 13px;
color:#262626;
text-align:center;
}

#top_ad {
width:100%;
height:100px;
background: #0f3245;
text-align:center;
padding-top:10px;
}

#footer {
    border-top: 6px solid #C9660D;
    padding-top: 0;
    width: 100%;
}

Answer 1

听起来你只需要一个可滚动的div来包含你的桌子。这里我使用宽度100％，但您可能希望使用width =到页面的宽度。

http://jsfiddle.net/XXhzp/

<div id="tablecontainer" style="width: 100%; overflow: scroll;">
    <table>
        <tr><td></td></tr>
        <tr><td></td></tr>
        <tr><td></td></tr>
    </table>
</div>

Answer 2

向您的身体贴上100％的宽度

Answer 3

尝试在页面中的所有内容中添加容器div。据推测，该div将采用子表的宽度，然后将该宽度赋予其他div，如果它们设置为100％。

大桌子，周围的背景div不会重复

3 个答案: