FF下,table元素放在div中会影响父层DIV的布局
一个div中嵌两个子div, 两个子div总宽度不超屏幕，所以应该是可以在同一行上,这是原来的HTML代码:
<div style="float:left;width:950px;margin:5px 20px 5px 5px"><div style="float:left;width:700px;margin:5px 20px 5px 5px"><div style="float:left;width:700px;margin:2px 10px 20px 5px;"> <h2 class="other"><a href="/">主页</a> > <a href="/booksorts.html">图书分类</a> > <a href="/sort/7/p1.html">旅游</a> > <a href="/sort/144/p1.html">旅游随笔</a> > </h2></div></div><div style="float:left;margin:35px 0px 5px 5px;align:center"> <table width="80%"border="0"> <tr> <td align=center> <img src="http://images.amazon.cn/m/md_bkbk609930.jpg" width="134"> </td> </tr> <tr> <td align=center > <a href="/review/97627.html">查看该图书总共5个评论</a> </td> </tr> </table> </div>但是由于第二个子div中使用了table, 该div就出现了换行,UI截图如下:
http://www.mytushu.com/111.gif
但是如果把以上第2个div中的table都替换为div,则会正常显示了，看现在的效果:
http://www.mytushu.com/item/97627.html
代码差别之处:
<div style="float:left;margin:35px 30px 5px 35px"> <div><img src="http://images.amazon.cn/m/md_bkbk609930.jpg" width="134"> </div> <div> <a href="/review/97627.html">查看该图书总共5个评论</a> </div><div>但是,在IE不会出现这样的情况, 所以, 感觉FF还是更严谨!
页:
[1]