Question

编辑2：

问题似乎存在于“bigTable”元素的规则上。显然，当在布局模板上使用时，它会继承错误的最小宽度。我还在调查这个。

不过，我还要再试一次div。一个大问题是使用固定导航和动态内容，但我已经找到了圣杯 - 解决方案（http://alistapart.com/article/holygrail）。

感谢您的建议＆amp;所有可爱的手枪。

编辑：

我有一个表+ td宽度的奇怪问题。我有类似的代码：

<table class="mainLayout" style="width: 100%;">
    <tr>
        <td style="width: 250px;">
            <div id="leftNavigationPanel"> * content * </div>
        </td>
        <td id="panelCell">
            <div class="panel">
                 <table id="bigTable" width="100%"> * LOTS OF CONTENT, includes big table * </table>
            </div>
        </td>
    <tr>
</table>

当我在浏览器上运行此代码时，mainLayout会溢出，因此它变为3600px，这是因为Panel内的大表。

我所指的大表可以包含在屏幕内。这样做，它得到水平滚动条（这是我想要的）。如果将大表加载到具有规则“width：100％”的单独html文件中，则此方法有效。

在添加mainLayout规则“display：block;”之后，mainLayout表被渲染为~1800px并且包含在屏幕内，但问题是“panelCell”-TD仍然是~3400px宽，所以我还有整页滚动... TD不包含在表中，但总是扩展到250px + bigTable.width（）！

基本上浏览器不知道如何计算“panelCell”只能填充：window.width - leftNavigationPanel。

如何在不使用“panelCell”的javascript +预先计算的最大宽度规则的情况下制定正确规则的任何想法？

panelCell必须包含在窗口中
bigTable必须包含在panelCell中，并带有滚动条

Answer 1

设置table-layout：fixed修复了表格的许多奇怪问题：

<table style="table-layout:fixed;">
<col style="width:250px"/>
<col/>
<tr>
...

CSS表100％宽度，td宽度

1 个答案: