css - 怎样使float元素超过父元素的width强制不换行？

问题描述

问 题

<ul class="clearfix">
    <li></li>
    <li></li>
    <li></li>
</ul>

ul{width:100px;}
ul li{float:left;width:40px;height:40px;background:red;border-right:2px solid blue;}

浮动元素有没有像white-space: nowrap;一样强制不换行的属性？

解决方案

换个思路，可以在ul外部嵌套个div，ul设置宽一点，但是外层div还是100px即可。

<div>
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>
<style>
div{width:100px;}
div ul{width:9999px;}
ul li{float:left;width:40px;height:40px;background:red;border-right:2px solid blue;}
</style>

这篇关于css - 怎样使float元素超过父元素的width强制不换行？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！