Three-pixel text jog

| |
[不指定 2008/09/26 08:08 | by Else ]
This issue was originally documented by Holly Bergevin and Big John Gallant on positioniseverything.net.

http://www.positioniseverything.net/explorer/threepxtest.html
Fixing this 3-pixel text jog that's introduced when line boxes with inline elements are adjacent to a float in IE/Windows requires giving the paragraph an explicit dimension, which prevents IE/win from adding the 3px space. However, adding a dimension (width or height) also throws IE into a proprietary float model- and the element will act much like a float, displaying next to the real floated element, as opposed to letting the float overlap it.


The old (pre-IE7) solution for this bug, and several others, was the Holly Hack. However, the Holly Hack relies on buggy behavior that is no longer present in Internet Explorer 7 -- and using it can cause things to go a bit haywire. Instead, use an Internet Explorer Conditional Comment (IECC) to apply zoom: 1 to the line box in all versions of Internet Explorer. This will give the box the "layout" it needs to prevent the three-pixel gap, without throwing Internet Explorer into its proprietary float model.


<!--[if IE]><style type="text/css"> .mybuggyelement { zoom: 1;}</style><![endif]-->


作者:Else 's Blog
地址:http://www.aixq.com/post/1229/
版权所有。转载时必须链接形式注明作者和原始出处及本声明!
  • 中查看更多“Three-pixel text jog ”相关内容
  • 中查看更多“Three-pixel text jog ”相关内容
  • 中查看更多“Three-pixel text jog ”相关内容
  • 中查看更多“Three-pixel text jog ”相关内容
  • 中查看更多“Three-pixel text jog ”相关内容
  • 中查看更多“Three-pixel text jog ”相关内容

  • 最后编辑: Else 编辑于2008/09/26 08:19
    代码 程序 编程 | 评论(0) | 引用(0) | 阅读(305)
    发表评论
    表情
    emotemotemotemotemot
    emotemotemotemotemot
    emotemotemotemotemot
    emotemotemotemotemot
    emotemotemotemotemot
    打开HTML
    打开UBB
    打开表情
    隐藏
    昵称   密码   游客无需密码
    网址   电邮   [注册]