css - 如何获得在 IE8 中工作的输入的底部填充？

Question

我在应用程序查看器中运行网站。此查看器将以我无法控制且无法更改的 IE8 兼容模式呈现网站。

我有一个 input，顶部/底部 padding 为 6px，左/右 padding 为 12px，但由于某些奇怪的原因 bottom padding 被忽略，padding 不正确。

这是我看到的截图:

这是我用来设置 input 字段样式的 CSS:

input[type="text"] {
    line-height: 1.42857143;
    vertical-align: middle;
    font-size: 14px;
    font-weight: normal;
    padding: 6px 12px 6px 12px;
    *padding: 6px 12px 6px 12px;
}

我已经用 Google 搜索了一段时间，但似乎无法找到解决我的问题的方法。我发现的许多技巧建议使用各种 line-height 调整，而有些建议使用 *padding: 6px 12px 6px 12px;。这些提示均无效，问题仍然存在。

如何在 IE8 中强制输入具有相等的顶部和底部填充？

注意:我不能使用 http-equiv 元标记，因为它会给查看器带来其他问题。

Answer 1

你不能 :(

---

您可以改为设置常规标签的样式:

span {
  float: left;
  border: inset gray 2px;
  background: white;
  line-height: 2em;
  height: 2em;
}

span input {
  border: none;
}

.submit,
.submit input {
  background-color: #337AB7;
  border: solid #337AB7 2px;
  width: 3em;
  color: white;
  text-align: center;
}

p {
  display: inline-block;
  box-shadow: 0 0 3px white;
}
body {
  background: tomato;
}

<p>
  <span>
   <input type="text" value="(800) 123-456789" /> 
  </span>
  <span class="submit">
   <input type="submit" value="Dial"/><!-- unless this a link , styles to be applied here & span can be skipped -->
  </span>
</p>