float:left却不在最左边的原因之一

最新推荐文章于 2023-03-16 11:33:48 发布

qidizi

最新推荐文章于 2023-03-16 11:33:48 发布

阅读量1.4w

点赞数 4

分类专栏： css 文章标签： css float left

本文链接：https://blog.youkuaiyun.com/qidizi/article/details/20934037

版权

css 专栏收录该内容

9 篇文章

订阅专栏

本文通过实例演示了CSS中使用浮动属性(float)进行布局时遇到的问题，并探讨了解决方案。展示了当元素设置为浮动时可能导致的布局错位现象，特别是关于如何确保元素正确对齐到页面左侧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<div>
<div style="border:1px solid yellow;height:20px;margin:10px;"><div style="line-height:50px;float:left;border:1px solid green;margin-right:10px;">float:left;</div><div style="clear:both;"></div></div>


	<div style="border:1px solid;"><div style="float:left;border:1px solid red;">float:left;</div><div style="clear:both;"></div></div>
</div>

测试代码

显示效果,可以看到红色框不在最左边,在某些情况下,如果看不见第一个float话,就会很郁闷,float第二个不在最左.解决float问题得找与它最近的,有没有另一个的高度超过了顶边