在百度知道搜资料的时候看到一个网友问了关于CSS浮动的问题，问题地址在这里，直接看代码:
<body> <div style="background:red; height:100px; width:200px; float:left;">111111111111111</div> <div style="background:grey; height:100px; width:200px;">222222222222222</div> </body>
看了上面代码很简单，相信从理论上你也应该看出会是什么样的一个显示方式。但问题就在于你没想到的地方。看下面的效果：
111111111111111222222222222222
再试试不同的浏览器，我使用的IE和Chrome，可以明显的看出两者的不同之处。为了更明显的看出区别在哪，你可以本地新建一个文档，贴入下面的代码：
<body> <div style="background:red; height:100px; width:200px; float:right;">111111111111111</div> <div style="background:grey; height:100px; width:200px;">222222222222222</div> </body>
然后收到缩小浏览器窗口的宽度，看看两者是怎么个float方式。
之前也没遇见过，当然也可以为第二个div加个float就能解决，但问题在于我没想清楚这样的不兼容到底怎么去解释。不过从理论上IE的渲染结果比较符合我的理解，Chrome的结果有点让我出乎意料。
请问各位高手，如此问题你如何解释？
给第二个加个margin-left:200px
解决办法有很多，但解释不清楚。可能知识太少的原因，呵呵
浮动。唉。。很恼火，对这个。
晕，代码发不上来。
就是第一个DEMO，把2那个div宽度增加，把测试的1，2数字都换成中文。
换成中文的话，似乎也是一样的，用的Chrome。
把第二个DIV的宽度换成500，你就看得懂了，所有浏览器都一样。
我纠结了，看这个图http://t0.qpic.cn/mblogpic/433e395acb95889ca76e/2000
http://jsfiddle.net/4WfSV/
你截图应该是IE7吧。我这边IE8和Chrome效果一样。
使用的时候，不建议第二个div加宽度。
哈哈，真的是IE8，Win7 Sp1。我也去jsfiddle测试了下，IE8和Chrome确实是一样的效果，可保存到本地的时候仍然出现上面的问题，无论是否开启兼容模式。这个问题的解决方法倒是知道，就是有点摸不着头脑解释不清楚。先谢谢你西门大哥。
擦，你第一个demo写得有问题，害我也被误导了。。。
文字文字
也是的
看这个，自己理解。
👿 沙发，可惜我看不懂！！