Html 如何创建溢出时滚动的表格单元格
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5662357/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to create a table cell that scrolls when overflowing
提问by zozo
I must create a table cell with a fixed height and width, but with a lot of content; something using overflow: auto
. The problem is that I can't use display: block
on a table cell (it kind of breaks the table layout) so I tried this:
我必须创建一个高度和宽度固定但内容很多的表格单元格;使用overflow: auto
. 问题是我不能display: block
在表格单元格上使用(它有点破坏表格布局)所以我尝试了这个:
height: 100px;
overflow: auto;
position: relative;
width: 1280px;
But it's not working. Here is my markup:
但它不起作用。这是我的标记:
<tr>
<td colspan="3" style="width: 1280px; overflow:auto;">
{assign var="latime" value=$agenda|@count}
{assign var="latime" value=$latime*150}
<div style="width: 1280px; position: relative; overflow: auto; ">
<div style="width: {$latime}px; height: 100px; position:relative;">
{assign var="i" value=0}
{foreach from=$agenda item=ag}
{assign var="img" value=$agenda[$i][3]}
<img src="{$img}" id="imag{$i}" onclick='schimbaslidetoti({$i})' />
{assign var="i" value=$i+1}
{/foreach}
</div>
</div>
</td>
</tr>
回答by DavW
You can nest a block-level div with the overflow:scroll property set inside the table cell. ie
您可以使用设置在表格单元格内的 overflow:scroll 属性嵌套块级 div。IE
<td><div style="overflow:scroll;">Content</div></td>