列表横排,设置了float没有作用怎么解决

列表横排,设置了float没有作用怎么解决？

今日遇到了一个float的失效的效果，想了良久解决了。特有做了一些测试，如果有遇到这类问题的，可以查看一下。

1、第一个常见问题flex布局

我想要说明的是flex布局与float浮动不能同时对一个对象 *** 作。

如果父对象是flex布局，子对象是flaot浮动也是没有效果是。

2、块元素，内联块元素，行内元素的问题

float浮动是无法对行内元素起效果的。

如果需要，可以根据直接的需求转换为块元素或者是内联块元素。

在CSS中使用float指定浮动属性值，该属性的值指出了对象是否及如何浮动，浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的标准流中，所以文档的标准流中的块框表现得就像浮动框不存在一样。float的基本语法：

float：none | left | right

1、float取值

none： 设置对象不浮动，默认值

left： 设置对象浮在左边

right： 设置对象浮在右边

2、float的特性

a)、浮动元素会从标准流中脱离

b)、浮动元素会触发BFC（块级元素格式化）、不影响外边距折叠

c)、 float元素会变成块标签

如果float不是none，当display:inline-table时，display的计算值为table；当display:inline | inline-block | run-in | table-* 系时，display的计算值为block，其它情况为指定值。

float在绝对定位和display为none时不生效: 当display为none时元素会隐藏，所以float意义不大；当position为absolute绝对定位时元素也将从标准流中脱离，元素使用偏移量移动，float特性无效。

浮动元素间会堆叠: 浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止

浮动元素不能溢出包含块: 浮动元素在包含块内，当包含块的宽度不足以容下浮动的子元素时，将自动折行；垂直方向当包含块认为浮动的子元素没有高度时，子元素会溢出，BFC能解决该问题。水平方向不会溢出，垂直方向有可能会溢出

清除浮动

该属性的值指出了不允许有浮动对象的边。

clear：none | left | right | both

适用于：块级元素

取值：

none： 允许两边都可以有浮动对象

both： 不允许有浮动对象

left： 不允许左边有浮动对象

right： 不允许右边有浮动对象

---