div+css实现左中右布局，解决右边一块掉落的问题

最新推荐文章于 2023-09-24 22:12:04 发布

原创最新推荐文章于 2023-09-24 22:12:04 发布 · 6.7k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#css #div布局

div+css 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了在CSS布局中，通过修正`float`属性值为`left`，解决了使用div+css进行左中右布局时，右侧元素掉落的问题。

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<style type="text/css"> 
.clgl-13{ width:600px; margin:0 auto;}
.clgl-14{ background: #0000FF;float:left; width:200px; height:35px; padding-top:200px; line-height:35px;  text-align:center; }
.clgl-16{ background: #99FF99;float:left; width:200px; height:35px; padding-top:200px; line-height:35px; text-align:center; }
.clgl-15{ background: #99FFFF;float:left; width:200px; height:35px; padding-top:200px; line-height:35px;  text-align:center; }

</style> 
</head> 
<body> 
    <div class="clgl-13">
        <div class="clgl-14">ddddddd</div> 
        <div class="clgl-16">ffffff</div> 
        <div class="clgl-15">vvvvvvvvvvv</div>
    </div>
</body> 
</html>