0

我正在为一个项目创建某种网格。网格有一个特殊要求（这就是我们试图在内部创建一个的原因），中间的列必须是可滚动的。

想象一下情况：我们创建的网格或多或少是这样的：有一个 topcontainer div，其中包含 3 个其他 div 左中容器和右容器。左侧容器包含划分为 4 列的用户信息。中间的 div 包含 x 列（取决于经理选择的周数）和文本框，可以在其中输入某个员工的小时数，右侧的 div 有一些列用于总计和平均值。

回答我的问题：当我使用来自服务器 (asp.net 2.0) 的数据呈现控件或通过 javascript 添加一行并选择用户时，包含 userdata 的左列应该具有动态宽度，我想要在 leftcontainer 中留下列，以便在需要时自动水平调整大小，并且顶部容器中出现一个额外的滚动条（以避免我的 div 垂直分解）我认为第二个 topcontainer div 具有最大宽度，topcontainer div 溢出-x: scroll, + a width: auto 在我的列中应该可以解决问题，但这似乎不起作用。

谁能让我走上正轨？我希望我的解释是可以理解的。无论如何，我添加了一张图片 [图片][1] 基本上我希望我的左栏能够适应其内容的宽度并水平保持在同一水平面上。

谢谢。

4

1 回答 1

1

我是无表格 CSS 设计的大力倡导者，但如果您需要的是表格，请使用表格。

这是一些我认为我已经让你开始的代码。

我想将中间列设置为屏幕的 %，但它不会滚动。它扩展到内表的大小。

我希望您需要在 3 列中的每一列中添加内部表格以显示您的内容。

<html>
<head>
<style>
table {
    width: 100%;
}
.left {
    background: red;
    width: 100px;
}
.right {
    background: blue;
    width: 100px;
}
.middle {
    background: green;
    width: 800px;
    display: block;
    overflow: scroll;
}
.inner {
    width: 2000px;
    height: 100px;
    background: black;
    display: block;
}
</style>
<body>
<table>
<tr><th class="left">Left</th><th class="middle">Middle Central block<table class="inner">Inner table</table></th><th class="right">Right</th></tr>
</table>
</body>
</html>
于 2009-04-15T23:26:09.617 回答