表格属性的最小宽度和最大高度 [英] Min-width and max-height for table attributes

查看:33
本文介绍了表格属性的最小宽度和最大高度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个表格,我想定义 min-widthmax-height 属性.请参阅下面的示例.

我现在的问题是浏览器不接受.如果我在 td 上定义它,它会被忽略,如果我在 td 元素内的 div 元素中定义它,则内容具有正确的 min和最大宽度,但表格仍然具有相同的大小.(所以有很多可用空间:/)

我该如何解决这个问题?

我只是注意到这个问题似乎只发生在表格处于全屏模式时.尽管如此,一个元素的宽度不应超过最大宽度!

示例:

<头><style type="text/css">TD{边框:1px纯黑色;}html,body,.fullheight {高度:100%;宽度:100%;}.minfield {最大宽度:10px;边框:1px纯红色;溢出:隐藏;}</风格><身体><table class="fullheight"><tr><td class="minfield"><div class="minfield"><p>你好</p>

</td><td><p>welt</p></td></tr>

解决方案

对于表格单元格,应使用 '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.

这篇关于表格属性的最小宽度和最大高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆