CSS：当显示设置为none时没有DIV宽度
我正在制作一个下拉小部件的过程。 向下扩展的菜单设置为与父级相同的宽度（使用jQuery）。
窗口小部件按预期工作，但是，将它放在DIV容器中，初始显示设置为无。 显示此容器时，根据jQuery的所有下拉宽度都为零…如果默认显示容器，则所有容器都有效。
希望我的小提琴能够更好地说明我的意思： http ： //jsfiddle.net/ruFzR/在结果窗格中; 顶部下拉列表位于容器外部，底部位于容器内部。 除了一些明显的样式问题，宽度不会扩大。
您可以避免display: none;引起的宽度问题display: none; 通过使用visibility: hidden; 代替。 使用visibility: visible; 让它可见
元素保持在您的内容流（相同大小等）内，而它只是不可见。
如果您需要隐藏的某些内容的宽度而无法以任何原因取消隐藏它，您可以克隆它，更改CSS以使其显示在页面外，使其不可见，然后进行测量。 如果用户隐藏并随后删除，则用户将不再聪明。
例：
$itemClone = $('.hidden-item').clone().css({ 'visibility': 'hidden', 'position': 'absolute', 'z-index': '-99999', 'left': '99999999px', 'top': '0px' }).appendTo('body'); var width = $itemClone.width(); $itemClone.remove();
.width（）由浏览器处理，这就是为什么你得到“0”尝试使用属性
$('#elt').attr('width');
从示例我不知道问题是什么..
但你应该设置（ 在那个例子中 ）
.splitButton2 > div{width:100%;}
这相当于你编写的jQuery代码，没有缺点（ 如果元素是display:none ，则宽度为0 display:none ，javascript依赖 ）并且在浏览器上更容易。
如果你打算使用display:none:你必须首先显示菜单，计算宽度，然后隐藏它。 或者，您可以使用绝对定位隐藏，这应该自元素绘制以来正确报告宽度。 示例： position: absolute; top: -999em; position: absolute; top: -999em;