CSS拉伸容器到最宽的隐藏子元素的宽度

Oli*_*ryn 4 html javascript css containers

我有一个非常简单的示例,带有黑色边框的无序列表,其中一个子元素隐藏:http://jsfiddle.net/spryno724/Sm9Lx/1/.请注意隐藏的子元素比可见元素宽得多,但容器只能缩放到可见子元素的宽度.

CSS中是否有一种方法可以自动将此容器的宽度扩展到其最宽子元素的宽度,即使该元素被隐藏?

我知道这可以通过JavaScript实现,但是如果可能的话,我想避免脚本攻击并直接使用CSS.

此外,我想避免设置特定的宽度,因为在我的实际应用程序中,我的容器将包含未知宽度的可视对象.

感谢您的时间.

Dav*_*igh 6

使用visibility: hidden;而不是display: none;隐藏li

  • visibility: hidden; 保留元素空间

  • display: none; 就好像元素在标记中不存在一样

  • 只有可见性:隐藏,ul才会扩展以适应元素的高度.不确定OP是否需要.在下面的答案中,我添加了高度:0 (3认同)