为什么CSS min-width属性不强制div具有指定的最小宽度？

Question

为什么CSS min-width属性不强制div具有指定的最小宽度？

<html>
    <head>
        <style type="text/css">
            div {
                border:1px solid #000;
                min-width: 50%;
            }
        </style>
    </head>
    <body>
        <div>This is some text. </div>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

我认为div应该是页面的50%,除非由于某种原因,div中的文本使其更大.但是,div周围的边框会延伸整个页面宽度.这在IE和Firefox中都会发生.

建议？

Answer 1

Dav*_*lar 14

我认为div应该是页面的50%,除非由于某种原因,div中的文本使其更大.

min-width没有设置块的最小起始宽度; 相反,它限制了块可以缩小的程度.

In min-width: 50%;,50%是指包含块.我从来没有使用百分比min-width,但我发现它可以用于其他单位.例如,如果我有一个块(像一列文本),我想要全宽,但我不希望它低于最小宽度,我可以使用类似的东西{width: 100%; min-width: 250px;}.

请注意其他人提到的IE支持的警告.

Answer 2

Chr*_*rra 8

如果您为absolute元素提供定位,它将50%在Firefox中.但是,IE不喜欢min-width或min-height属性,因此您必须定义宽度以及50%它在IE中工作.

Answer 3

but*_*oxa 7

没有min-width,你的div将占用整个页面宽度,这就是display:block元素的行为方式.添加min-width不能使它变小.

将display属性更改为absolute或float属性left将使元素缩小以适合内容.然后,min-width开始有意义.

归档时间：	17 年前
查看次数：	38142 次
最近记录：	9 年，6 月前