当前位置：首页 > 设计在线 > 网页设计 > CSS/Xhtml > DIV浮动IE文本出现3px间距的bug

DIV浮动IE文本出现3px间距的bug

点击次数：33 次发布日期：2008-11-21 23:50:24 作者：源代码网

源代码网推荐

发生场合：当左边对象是浮动的，右边对象采用外补丁的左边距来定位，则右边对象内的文本会离左边有3px的空白误差。

没加修正：

运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> <style type="text/css">  </style> </head> <body> <div id="layout"><div id="floatbox">floatbox</div><p>离左边3px</p><p>离左边3px</p></div> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

修正过：(加了以下代码)

* html #floatbox {
margin-right: -3px;
}
* html p {
height: 1%;
margin-left: 0;
}

不考虑mac下ie5.02

运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> <style type="text/css">  </style> </head> <body> <div id="layout"><div id="floatbox">floatbox</div><p>现在没有3px了</p><p>现在没有3px了</p></div> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

源代码网供稿.

上一篇: 用CSS做的几个漂亮的Button 下一篇: css元素定位

网友评论 (0)

我也要写评论

DIV浮动IE文本出现3px间距的bug的相关新闻

会员中心

设计在线

本站推荐

设计在线之精华