CSS div 宽度 - 仅内容宽度..？答案

【问题标题】：CSS div width - content width only..?CSS div 宽度 - 仅内容宽度..？
【发布时间】：2009-08-20 13:06:57
【问题描述】：

我试图让我的 div 成为我的内容的宽度，我可以让它在除 IE 之外的所有其他浏览器中工作，使用：

div#quoteHolder {
  height: 85px;
  display: inline-block;
}

有谁知道如何在 IE 中解决这个问题？

哦，这是 html 代码..

<div id="quoteContainer">
  <div id="quoteHolder">
    <h2>"If you were lucky and lived in Port Melbourne, it might even be your local"</h2>
    <h3>The Age, Epicure. JUNE 22nd 2004</h3>
  </div>
</div>

【问题讨论】：

[另一种解决方案][1] [1]：stackoverflow.com/questions/1304037/…

标签： css internet-explorer html

【解决方案1】：

IE 支持 inline-block，但仅适用于本机内联的元素。所以，如果你真的想使用 inline-block，你会被限制在 spans 和 strongs 和 ems 上，而列表或段落可能更具有语义意义（并且对于非 CSS 用户来说也会更好地降级。）

但是，如果你在块元素上触发 hasLayout(set hasLayout=true in that element)，然后将其设置为 display:inline，它就会神奇地变成 IE 中的 inline-block！通过使用属性 hack（我非常喜欢），您可以毫不费力地从所有非 IE 浏览器中隐藏 display:inline。

下面是代码，简洁明了：

display:-moz-inline-stack;
display:inline-block;
zoom:1;
*display:inline;

【讨论】：

魔术！我花了很多时间寻找这个。谢谢！

【解决方案2】：

IE 有很多display 模式的问题，请参阅此处：http://www.quirksmode.org/css/display.html。 float: left 可能是您正在寻找的，或者 display: inline，但随后 height 将不起作用。

【讨论】：

内联显示会移除85像素的高度
谢谢，高度 85px 不是必需的，它只是让我看到我的 div（带边框），我使用 display: inline 并且它工作得很好，谢谢！ :)

【解决方案3】：

div#quoteHolder {
  height: 85px;
  display: inline-block;
  border: #a9a9a9 1px solid;
  float: left;
}

【讨论】：