0

我想max-width在其子元素浮动的容器元素上进行设置。我该怎么做？

默认情况下，该max-width属性在给定场景中不起作用（但min-width确实如此）。这是一个小提琴，你可以用它来帮助我解决这个问题。

查看小提琴的预览窗格——这就是我所说的（.dropdown-menu类定义了相关的样式）：

最小宽度不起作用

但这就是它应该看起来的样子（有点）：

预览它的外观

4

4 回答 4

1

替换position:absolute;为position:fixed;

并更改left:0px;为left:35px;

更新笔：http ://codepen.io/joe/pen/hzDaG

于 2012-12-14T09:44:35.633 回答
0

更改position:absolute为position: fixed;_.dropdown-menu

width/height:100%不适用于绝对位置。

.dropdown-menu {
    position: fixed;
    top: 36px;
    left: 35px; 
    z-index: 1000;
    display: none;
   max-width: 100% !important; 
    padding: 0;
    margin: 0;
    list-style: none;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.12);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.12);
    color: #222;
}

演示

于 2012-12-14T09:45:00.287 回答
0

为什么不直接使用 with 而不是 max width，那样工作.. 或者放一个 div 来包围 ul 标签然后放一个宽度

于 2012-12-14T09:54:17.273 回答
0

这些引用应该回答这个问题：

浮动框位于正常流中，然后从流中取出并尽可能向左或向右移动。内容可能会沿着浮动的一侧流动。

当一个盒子从正常流中取出时，所有仍在正常流中的内容将完全忽略它并且不为它腾出空间。

您应该始终在浮动项目上设置宽度（除非直接应用于具有隐式宽度的图像）。如果未设置宽度，则结果可能无法预测。

一方面，被浮动的盒子应该有一个明确的或隐含的宽度。否则，它将水平填充其包含块，就像非浮动内容一样，没有空间让其他内容在其周围流动。其次，与正常流程中的盒子不同，浮动盒子的垂直边距不会随着盒子的边距在其上方或下方折叠。最后，浮动框可以与正常流程中与其相邻的块级框重叠。

- 通过粉碎杂志

因此，您唯一的选择是min-width和width。

于 2012-12-20T17:58:21.327 回答