html - Firefox 中的填充问题?

标签 html css firefox padding

我目前遇到一个问题,即 Firefox 在 div 中的某些文本周围去除 1-2 像素的填充。在写太多之前,我将展示一些图片并发布代码,以便您了解我的意思。这可能只是 Firefox 呈现的方式。 Anywho代码和图片如下:

Chrome/Safari/Ie 屏幕:

enter image description here

Firefox 屏幕:

enter image description here

代码如下:

html页面:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>
    <head>
        <title>Test Page One</title>
        <LINK REL=StyleSheet HREF="stylesheets/test.css" TYPE="text/css" MEDIA=screen>      
    </head>
    <body>
        <div class="single_label blue_label">Test<div class="remove"></div></div>
    </body>
</html>

CSS:

.single_label{ 
  float: left; 
  padding-right: 5px; 
  padding-left: 7px; 
  height: 14px; 
  color: black; 
  font-size: 10px; 
  font-family: Helvetica, Verdana, Arial, sans-serif; 
  text-align: left; 
  width: 74px; 
  vertical-align: bottom
}

.blue_label {
  background-color: #3acbff;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

那么谁能告诉我为什么 Firefox 会这样呈现以及如何解决这个问题?

最佳答案

嗯,您可能有其他 CSS,但在列出的代码中,您从未设置行高,因此您依赖于浏览器默认值。尝试设置特定的行高。

关于html - Firefox 中的填充问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4891663/

相关文章:

javascript - 如何删除嵌套的 UL 元素但保留子元素

php - 尝试根据我发现的 Flash 元素设计 HTML5 页面

html - 如何使用结束选择器在链接旁边附加一个图标?

Firefox v36 及更高版本中的 CSS Flexbox 问题

html - Firefox 12,无法播放声音文件。不支持 "type"的指定 "audio/mp3"

php - 通过dropdownlist向mysql插入数据

html - 如果需要,CSS 输入效果将不起作用

javascript - 当 div 在视口(viewport)之外创建时,溢出滚动将不起作用

python - 如何使用 Selenium for Firefox (geckodriver) 将 navigator.webdriver 设置为未定义

html - 为什么我的 div 没有放置 "inside"包装器 div?