神奇的clear:right

其实这个问题在去年做不会自己会动的书时就发现了,不过一直没有整理出来,IE对百分比的计算是四舍五入的,也因而出现100%大于100%的情况,其实,可以用clear:right来解决问题,今天在整理clear的用法时突然想到。

测试页面,IE打开

clearright
再配合overflow:hidden就可以搞定问题。

不要问我这个是为什么,我也不知道原因,谁知道跟我说下,我也是那里玩时偶然发现的。XD 代码在这里

<div class="wrapper">
<div class="sbox">Content</div>
<div class="sbox">Content</div>
</div>
.wrapper{
clear:both;
float:left;
width:150px;
border:3px #666 solid;
padding:3px;
background-color:#efefef;
}
.sbox{
/*clear:right;*/
float:left;
width:100px;
height:100px;
border:1px #000 solid;
background-color:#ccc;
}
This entry was posted in Web开发 and tagged , . Bookmark the permalink.

9 Responses to 神奇的clear:right

  1. .wrapper{ @ 2007-04-02 at 22:29

    .wrapper{
    clear:both;
    这个有何必要?

  2. McSpring @ 2007-04-04 at 21:41

    神奇的裸奔,神奇的技术。。。

  3. aoao @ 2007-04-09 at 00:40

    to 那个没有留名的朋友。
    那个是因为例子有多个。用来清浮动的。

  4. 英子 @ 2007-04-23 at 15:35

    只对IE有效。

  5. mercury @ 2007-05-24 at 14:17

    俺一般在上面布局较复杂,最后做bottom区时clear all下,就搞定了。

  6. minchao @ 2008-01-05 at 14:50

    这有什么用?

  7. aoao @ 2008-01-09 at 11:08

    @minchao 可以当bug利用。。有时布局可以用到

  8. chenc @ 2008-03-21 at 10:18

    Firefox有方法实现这样的效果吗?

  9. aoao @ 2008-03-21 at 17:42

    @chenc 也许有,不过我还没发现到 T_T

发表评论

(必填)

(必填)