代码之家 › 专栏 › 技术社区 › codegy

IE6底部额外填充物

internet-explorer-6 css

codegy · 技术社区 · 17 年前

[更新]

[另一个更新,代码示例]

.user-info{
    margin-top: 20px;
    margin-right: 20px;
    padding: 10px;
    background-image: url("../img/user_panel_bg.png");
    float:right;
    border: 1px #AAAAAA solid;
    font-size:12px;
}

6 回复 | 直到 17 年前

Kibbee 17 年前

你的部门有图像吗?如果有图像,IE 6中就有一个bug,它会导致div中的空白在底部产生额外的填充

额外的填充显示为

<div>
<img src="myimage.jpg">
</div>

<div><img src="myimage.jpg"></div>

jimg 17 年前

我强烈建议大家看看 positioniseverything.net 网站及其IE问题和解决方法的覆盖范围。看看holly hack部分-我相信你会在那里找到答案。

[编辑-添加]看一看 here 对于3px问题,请进行解释和修复

对于框设置和浏览器差异, sitepoints box model article 也提供了一些很好的见解。

Philip Arthur Moore 17 年前

你试过隐藏你的秘密吗 DIV overflow:hidden;

编辑:您也可以尝试 display: inline; 如果你说的是水平推。

Neil Monroe 17 年前

<div class="box">  
  <h1>Heading</h1>  
  <p>This is the main content.</p>  
  <div class="bottom"></div>  
</div>

…您将需要此CSS:

<style type="text/css">
  .box {
    background: url(bg-middle.jpg) repeat-y;
  }
  .box h1 {
    background: url(bg-top.jpg) no-repeat;
  }
  .box .bottom {
    background: url(bg-image.jpg) no-repeat;  /* bottom cap image */
    height: 10px;                             /* height of your bg image */
    font-size: 1px;                           /* for IE6 */
  }
</style>