CSS div width - content width only..?

Question

I'm trying to get my div to be the width of my content, I can get it working in all the other browsers except for IE, using: ``` div#quoteHolder { height: 85px; display: inline-block; } ``` Does anyone know how to fix this in IE? Oh and this is the html code.. ```

"If you were lucky and lived in Port Melbourne, it might even be your local"

The Age, Epicure. JUNE 22nd 2004

```

Accepted Answer

IE supports inline-block, but only for elements that are natively inline. So, if you really want to use inline-block, you’re restricted to spans and strongs and ems, when a list or paragraph would perhaps make more semantic sense (and also degrade more nicely for non-CSS users.)

However, if you trigger hasLayout(set hasLayout=true in that element) on a block element, and then set it to display:inline, it magically becomes an inline-block in IE! By using the property hack (which I love so well), you can hide the display:inline from all non-IE browsers effortlessly.

Here’s the code, in all its brief loveliness:

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

CSS div width - content width only..?

Solution

Problem