Html 如何使用“最小宽度”；浮动：右“；CSS中的元素？
看看这个 只要CSS规则中有Html 如何使用“最小宽度”；浮动：右“；CSS中的元素？,html,css-float,css,Html,Css Float,Css,看看这个 只要CSS规则中有float:right，html就不尊重minwidth .right { float:right; background:blue; min-width:400px; } 如果删除float:right或将其更改为float:left，则html元素的宽度不会小于最小宽度 对于向右浮动的元素，我们如何使用min width 屏幕截图：正如一些人评论的那样，这是我在Debian上最新版本的Chromium上看到的 正如您所看到的，div的左
float:rightminwidth.right {
float:right;
background:blue;
min-width:400px;
}
float:rightfloat:left最小宽度min width正如您所看到的，
div的左侧（包括其内容）是不可见的（换句话说，在可见部分之外）。div是一个块级元素，默认情况下它将占用100%的空间
或者，如果只想查看400px元素而不是100%宽度，可以使用显示：内联块
，或为其指定固定宽度
注意：如果不想使用display:inline块您可以保持原样，如果最小化窗口，您将看到一个水平滚动条，因此如果您认为使用minwidth
只会显示宽度为400 px的元素，那么您就错了，它是min
，而不是max
右浮动div正在做它在原始示例中被告知的事情：它保持至少400px宽。如果视口缩小到小于400px，则部分div将被遮挡，因为不允许其变得小于400px。所以问题是，你到底想要什么样的行为？也许您真正想要的是一个最小宽度为400px的非浮动包装器元素
编辑：下面是一个非浮动包装器如何使其工作的示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style media="all">
body {
background:red;
margin: 0;
padding: 0;
}
.wrap {
background:#e7e7e7;
min-height: 600px;
min-width: 400px;
}
.right {
float:right;
background:blue;
min-width:400px;
}
</style>
</head>
<body>
<div class="wrap">
<div class="right">
TEST
</div>
</div>
</body>
</html>
身体{
背景：红色；
保证金：0；
填充：0；
}
.包裹{
背景：#e7e7e7；
最小高度：600px；
最小宽度：400px；
}
.对{
浮动：对；
背景：蓝色；
最小宽度：400px；
}
试验
包装纸当然可以是红色的。我只是把它改成灰色，这样很容易看到。我在Mac上最新的Chrome浏览器上看得很好。甚至我在iMac上的Chrome浏览器上也看得很好，在firefox上的效果也很好20@PedroEstrada我添加了一个屏幕截图来显示我的问题。它对我也正常工作，Win 8上的最新Chrome。当你将float
设为块元素时，它充当内联块
元素，因此不需要明确地将元素设置为内联块
@Mojtaba，但我只是这样做来解释他：）使用内联块
并不重要，我需要使用float:right
，因为我想在右侧显示div（当窗口宽度远大于min width
@All Ya时，您可以安全地使用它，没有问题当将窗口宽度减小到400px以下时，我希望水平滚动可以使整个div可见，就像float:left
的情况一样。浏览器将永远不会向左滚动X坐标0。我已经用h是一个如何使用非浮动包装器元素的示例。