CSS “display: inline-block” in IE7

The CSS property “display: inline-block” only works in IE7 when it is applied to selectors that are displayed natively inline. For example, if you have an <h tag that needs to display as an inline-block you need to wrap the text with a span. This should be done with the span inside the h tag because valid XHTML doesn’t allow native block elements to reside inside native inline elements; e.g.

<h1><span class=”ie-block”>My Inline Headline</span></h1>

This is all over the Internet in various forms. There are many more complicated examples of using inline-blocks in IE. Just thought I’d post this simple note about it.

Published by


female pisces programmer colorado :: usa interests: ultras, running-hiking-skiing-snowshoeing-biking with my dog, dog frisbee, programming movies: a beautiful mind, crash, pollock, crouching tiger hidden dragon music: ani diFranco, sarah mcLachlan books: cryptonomicon, oryx and crake, the kite runner, when things fall apart, siddhartha, infinite jest quote: everywhere is walking distance if you have the time. -steven wright

4 thoughts on “CSS “display: inline-block” in IE7”

Leave a Reply