0

我有一些代码可以在页面底部显示徽标：

在 Chrome 中看起来像这样

不幸的是，在 IE（9，打开或关闭兼容模式）中，它看起来像这样：

在 IE 中看起来像这样

我真正担心的唯一部分是文本在错误的位置。

这是代码：

<img src="img/logo.png" id="kwiiusIMG" height="50"/><br /><br />
<p class="kText">A Kwiius.com service by Jamie McClymont</p>

CSS：

#kwiiusIMG {
  float: left;
  margin-left: 305px;
}

.kText {
  margin-left: 0px;
  text-align: center;
  color: #666666;
}

对不起，当谈到这些东西时，我有点白痴。知道如何让 IE 正常工作吗？

4

3 回答 3

1

你没有清除浮动。我曾经做过这样的事情（代码未经测试）：

<img src="img/logo.png" id="kwiiusIMG" height="50"/>
<br />
<div style="clear: both;"></div>
<br />
<p class="kText">A Kwiius.com service by Jamie McClymont</p>

我不知道整个设计，但我猜 float: left in #kwiiusIMG 根本不需要。

于 2012-04-17T22:11:13.707 回答
1

您可以将其添加到 .kText 的现有 CSS 中，而不是添加更多 HTML 标记

.KText {
clear: both;
}

这也避免了添加任何内联 CSS。

编辑：我还应该提到，正如 sparky672 在下面指出的那样，这使得中断标签变得不必要。他们应该被删除。

于 2012-04-17T22:20:07.953 回答
0

您也可以在图像上制作显示块并删除左侧浮动：

#kwiiusIMG {
    /*float: left;*/
    margin-left: 305px;
    display: block;
}

.kText {
  margin-left: 0px;
  text-align: center;
  color: #666666;
}​​
于 2012-04-17T22:54:59.547 回答