问题描述
我有一个表格,我想定义 min-width
和 max-height
属性.请参阅下面的示例.
我现在的问题是浏览器不接受.如果我在 td
上定义它,它会被忽略,如果我在 td
元素内的 div
元素中定义它,则内容具有正确的 min和最大宽度,但表格仍然具有相同的大小.(所以有很多可用空间:/)
我该如何解决这个问题?
我只是注意到这个问题似乎只发生在表格处于全屏模式时.尽管如此,一个元素的宽度不应超过最大宽度!
示例:
对于表格单元格,应使用 'width' 属性,因为表格单元格的 'min-width' 和 'max-width' 未定义.请参阅规范:
在 CSS 2.1 中,'min-width' 和 'max-width' 对表格、内联表格、表格单元格、表格列和列组的影响是未定义的."
要强制宽度,您可以尝试更改表格-layout 属性为固定".该规范非常清楚地描述了算法.
I have a table and I want to define the min-width
and max-height
properties. See example below.
My problem now is that the browser doesn't take it. If I define it on td
it gets ignored, if I define it in an div
element inside a td
element, the content has the right min and max width, but the table still has the same size. (so there is a lot of free space :/)
How can I resolve this?
EDIT:I just noticed that the problem seems to only occur when the table is in fullscreen mode. Nevertheless, an element shouldn't have more than the max-width than!
Example:
<html>
<head>
<style type="text/css">
td {
border: 1px solid black;
}
html,body,.fullheight {
height: 100%;
width: 100%;
}
.minfield {
max-width: 10px;
border: 1px solid red;
overflow: hidden;
}
</style>
</head>
<body>
<table class="fullheight">
<tr>
<td class="minfield">
<div class="minfield">
<p>hallo</p>
</div>
</td>
<td><p>welt</p></td>
</tr>
</table>
</body>
</html>
For table cells the 'width' property should be used, as the 'min-width' and 'max-width' is undefined for table cells. See the specification:
"In CSS 2.1, the effect of 'min-width' and 'max-width' on tables, inline tables, table cells, table columns, and column groups is undefined."
To enforce the width, you may try to change the table-layout property to "fixed". The specification describes the algorithm pretty clearly.
这篇关于表格属性的最小宽度和最大高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!