是否有可能阻止在HTML中包装子元素?
问题描述:
.container
{
position: absolute;
bottom: 0px;
height: 25px;
left: 200px;
padding-right: 5px;
background-color: black;
overflow: hidden;
}
.child
{
position: relative;
float: left;
height: 100%;
width: 95px;
background-color: #99CCFF;
margin-left: 5px;
}
我当浏览器窗口的大小小于将允许所有的孩子适应没有包装我想那里有一个滚动条,而不是子元素包装的默认机制。是否有可能阻止在HTML中包装子元素?
我不控制子元素的数量,所以我不能在容器上设置宽度。我怎样才能防止子元素的包装?
答
如果你不想包装,你不应该使用浮动 - 它们是专门为包装而创建的。
使用父容器与overflow:auto
和white-space:nowrap
和子display:inline
或inline-block
。
答
这对于简单的HTML和CSS来说并不可行。在不知道子元素的数量的情况下,唯一的方法是根据子元素的数量及其总宽度,使用JavaScript动态设置最小宽度。
答
您可以添加所有子类的父持有者()。然后使用该分区的溢出:自动。如果这不起作用,那么也可以使用self.innerHeight和self.innerWidth(通过javascript)获取div高度和宽度。
内嵌块是我需要使用的。谢谢 – Justin808 2010-09-12 23:19:14
@ Justin808:缺点是,如果您希望它能够在较旧的浏览器(FF2,IE6-7)上运行,您需要[一堆解决方法](http://foohack.com/2007/11/cross-浏览器的支持换直列 - 嵌段 - 定型/) – Tgr 2010-09-13 00:30:39