CSS 1px 高度问题 firefox 与 webkit 浏览器/ie答案

【问题标题】：CSS 1px height issue firefox versus webkit browsers/ieCSS 1px 高度问题 firefox 与 webkit 浏览器/ie
【发布时间】：2011-06-10 05:32:28
【问题描述】：

我有一个问题似乎很常见，但可能是通过多种方式引起的。

在我的项目网站 (FIXED) 上，将产品添加到左侧的扩展坞并更改数量不会导致问题。但是，当我在非 Mozilla 浏览器中打开我的项目时，<p class="count"> 元素（产品数量）让我头疼。 一个像素太低了，我似乎无法解决这个问题..

当然，使用 jquery 可能会出现丑陋的 hack，但我知道这可能是由于不正确的清除浮动或行高造成的，我希望有人能对此有所了解，这已经困扰了我好几个小时了。

丑陋的解决方案（仍然需要适合 ajax）..

<script>
$(document).ready (
function() {
  if (!$.browser.mozilla) {
   $('#test .count').css('padding-bottom','1px');
  }
}
);
</script>

【问题讨论】：

【解决方案1】：

我在 FireFox 和图像方面遇到过类似的情况。诀窍是将 div 或在我的情况下的图像设置为

display:inline;

默认图片设置为

display:block;

这会导致图像底部的一个额外像素使周围的 div 膨胀。

【讨论】：