使用固定大小且隐藏溢出的容器 div 时,水平对齐浮动 div 可能是一个挑战。默认情况下,浮动 div 在到达其父级的右边界时将换行到下一行,即使上面有可用空间也是如此。
所需外观是一排水平的 div在容器内,防止它们缠绕成多行。带空格的内联元素:no-wrap 可以实现这一点,但它不适合浮动的块级元素。
为了解决这个问题,您可以在具有足够宽度来容纳所有浮动 div 的容器。通过将容器和内部div的overflow属性设置为hidden,可以防止div溢出指定区域。
#container { background-color: red; overflow: hidden; width: 200px; } #inner { overflow: hidden; width: 2000px; } .child { float: left; background-color: blue; width: 50px; height: 50px; }
以上是如何在固定大小的容器内水平对齐浮动 Div?的详细内容。更多信息请关注PHP中文网其他相关文章!