Html 内容增长时如何阻止表格调整大小？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9523927/
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 stop table from resizing when contents grow?
提问by Maarten
I have a table, the cells of which are filled with pictures. I would like the pictures to grow larger when you hover over them and I would like the cells of the table to remain at the same size.
我有一个table，其中的单元格充满了图片。当您将鼠标悬停在图片上时，我希望图片变大，并且我希望表格的单元格保持相同的大小。
Changing the imgstyle to position:relativedoesn't work. Changing it to position:absolutedoes work, but I don't know the absolute position of the images.
将img样式更改为position:relative不起作用。将其更改为position:absolute确实有效，但我不知道图像的绝对位置。
Is there an elegant solution to this problem using CSS? I'd rather not use any JavaScript.
是否有使用 CSS 解决此问题的优雅解决方案？我宁愿不使用任何 JavaScript。
回答by Alex G de A
Use style="table-layout:fixed;", but this will make text or images overlap with other columns in case it exceed the width. Make sure not to place long text phrases without spaces.
使用style="table-layout:fixed;"，但这会使文本或图像与其他列重叠，以防超出宽度。确保不要放置没有空格的长文本短语。
回答by Marat Tanalin
Use table-layout: fixedfor your table and some fixed width for table itself and/or its cells.
使用table-layout: fixed你的表和表本身和/或它的细胞一些固定的宽度。
回答by Gueorgui
Use min-width in your cells, look an example here
在您的单元格中使用 min-width ，请看这里的示例
.cell1{
display:table-cell;
width:100px;
min-width:100px;
border: 2px dashed #40f;
}
回答by sinanakyazici
You can do to you can use position,z-index,left,top.
您可以使用位置，z-index，left，top。
you should look at this way,
你应该这样看
回答by brains911
Add vertical-align:topto the td elements.
添加vertical-align:top到 td 元素。
