CSS论坛 » CSS提问(问题解决)区 » float浮动问题

80man 发表于 2012-4-9 10:36

float浮动问题

右侧浮动不能和左边文字平行，这问题怎么解决？代码如下
<style type="text/css">
#ro {  padding:5px 10px 5px 20px; }
#ro span { float:right; }
.cc { clear:both; }
</style>
<!-----分割线------>
<div id="ro">您的位置：首页帮助 <span>右侧浮动</span>
<div class="cc"></div>
</div>

人生8186 发表于 2012-4-10 10:28

不知道 你有没有解决  这个在ie8下正常  ie6下就不行了  我找个办法  代码如下
<div id="ro"><span >右侧浮动</span>您的位置：首页帮助
<div class="cc"></div>
</div>

divcss5 发表于 2012-4-10 14:47

<style type="text/css">
#ro {  padding:5px 10px 5px 20px; }
#ro span { float:right; }
#ro .divcss5{float:left}
.cc { clear:both; }
</style>
<!-----分割线------>
<div id="ro"><div class="divcss5">您的位置：首页帮助 </div><span>右侧浮动</span>
<div class="cc"></div>
</div>

lft59598 发表于 2012-4-15 12:58

还是管理员的代码正确，我就给你讲一下原因。
如果要浮动，那就是说是二个平级别的内容块。而你的代码，把右浮动包含在左浮动的内容块里面，也就相当于父与子的关系，自然不会成功，当然你原来的代码格局不变的话，那就为右浮动写上绝对定位，它就会有固定的位置了。从外观上看就是你想要的，但是这样写就不能算是合格的代码，以后修改都比较麻烦。

as0303 发表于 2012-4-28 15:55

<style type="text/css">
#ro {  padding:5px 10px 5px 20px; float:left;}
#aaa { padding:5px 10px 5px 20px; float:right;}
.cc { clear:both; }
</style>
<!-----分割线------>
<div id="ro">您的位置：首页帮助</div> <div id="aaa">右侧浮动</div>
<div class="cc"></div>


这样就可以了。IE5.5以上版本都可以正常显示

as0303 发表于 2012-4-28 15:56

回复 1# 80man 的帖子

<style type="text/css">
#ro {  padding:5px 10px 5px 20px; float:left;}
#aaa { padding:5px 10px 5px 20px; float:right;}
.cc { clear:both; }
</style>
<!-----分割线------>
<div id="ro">您的位置：首页帮助</div> <div id="aaa">右侧浮动</div>
<div class="cc"></div>


这样就可以了。IE5.5以上版本都可以正常显示

查看完整版本: float浮动问题