html - IE7 宽度 :auto issue

Question

CSS

    #wrapper .tn{
      width:auto;
      height:20px;
      line-height:20px;
      float:left;
      padding:5px 2px 5px 5px;
      margin:0 5px 10px;
      font-weight:bold;
      background:#f0f0f0;
    }

HTML

    <div id="wrapper">
        <div class="tn">Text</div>
        <div class="tn">Text</div>
        <div class="tn">Text</div>
    </div>

以上代码在 FF,Chrome,Safari,Opera,IE9,IE8 中运行流畅。但是IE7有问题。 div 不根据文本扩展。它覆盖 wrapper div 作为宽度。我该如何解决这个问题？

Answer 1

我觉得没问题，使用 IE7 开发人员工具进行了检查，您可以尝试使用 display: inline-block; 而不是 float

#wrapper .tn{
  height:20px;
  line-height:20px;
  padding:5px 2px 5px 5px;
  margin:0 5px 10px;
  font-weight:bold;
  background:#f0f0f0;
  display: inline-block;
}