CSS div width - только ширина контента ..?

Question

Я пытаюсь сделать мой 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>

Answer 1

IE поддерживает встроенный блок, но только для элементов, которые изначально встроены. Поэтому, если вы действительно хотите использовать встроенный блок, вы ограничены диапазонами, сильными и слабыми сторонами, когда список или абзац, возможно, будут иметь более смысловой смысл (а также более приятным для пользователей, не использующих CSS).

Однако, если вы активируете hasLayout (установите hasLayout = true в этом элементе) для элемента блока, а затем установите его для отображения: inline, он волшебным образом станет встроенным блоком в IE! Используя свойство hack (которое мне так нравится), вы можете легко скрыть отображение: встроенное во всех браузерах, отличных от IE.

Вот код, во всей его краткой красоте:

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

Answer 2

IE имеет проблемы с большим количеством режимов display, см. Здесь: http://www.quirksmode.org/css/display.html. A float: left может быть тем, что вы ищете, или display: inline, но тогда height выиграл т работа.

Answer 3

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