Question

我遇到了一个非常令人困惑的问题。在this site上，我为除IE之外的所有浏览器正确排列了标题文本，其中文本被提升到离开标题框的位置。甚至IE10也有这个问题。以下是我标题的代码：

header {
  margin-bottom: 30px;
  background: #272727;
  border-radius: 5px;
  padding-bottom: 3px; }

  header .center {
    width: 94%;
    margin-left: 5.5%; }

  header h1 {
    font-family: "Bebas", "Verdana", sans-serif;
    font-size: 1320%;
    float: left;
    width: 21%;
    margin-top: -18px;
    line-height: 102%;
    letter-spacing: -15px;
    color: #e85d00; }

  header .motto {
    font: 400% "Bebas", "Verdana", sans-serif;
    float: left;
    width: 78%;
    line-height: 102%;
    color: white; }

据我所知，这里没有什么可以给IE带来麻烦，尤其是IE10，它应该可以与其他现代浏览器相媲美。有什么我想念的吗？此外，我有一个Bebas的font-face声明，工作正常，所以这不应该是一个问题。

Answer 1

我在IE8中测试过，IE9和文本显示就好了。为什么在ie.css中将header .center设置为display:none？这是你的意思吗？“留下标题”？

Answer 2

在引用定制的CSS表之前，您是否尝试过使用CSS重置表？我倾向于发现IE浏览器默认值因版本而异，因此通过使用CSS重置，它允许您的CSS在所有浏览器的相同基础上工作。

http://meyerweb.com/eric/tools/css/reset/

所有版本的IE中的布局都不同

2 个答案: