.net - 自动宽度和溢出 div

标签 .net html css grid

我正在为一个元素创建某种网格。网格有一个特殊要求(这就是我们尝试在内部创建一个的原因),中间的列必须是可滚动的。

描绘一下情况:我们或多或少地创建了网格: 有一个 topcontainer div,它包含 3 个其他 div,分别是左中容器和右容器。 左侧容器包含分为 4 列的用户信息。中间的 div 包含 x 列(取决于经理选择的周数)和文本框,可以在其中输入特定员工的小时数,右边的 div 有一些列用于总计和平均值。

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

任何人都可以让我走上正轨吗?我希望我的解释是可以理解的。 反正我加了一张图[图片][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>

关于.net - 自动宽度和溢出 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/750794/

相关文章:

c# - 在 .NET winform 中重现表格模型

html - 使输入标签填充表格单元格

c# - Controller 以字典为参数的 action stripping to dot

asp.net - 如何在网站项目中创建嵌入式资源?

Javascript:新图像未出现在 Firefox 和 IE 中

javascript - 使用 jQuery 打开和关闭的多个隐藏菜单?

javascript - 如何使用 Bootstrap 在 asp 文本框中使用日期选择器

javascript - 输入框选项下拉

c# - 如何在 Socket 类中使用动态端口?

html - Css 网格 : horizontal two colums, 但垂直翻转