This is a demonstration of the goog-inline-block CSS style.
This page is in quirks mode.
Click here for standards mode.
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Donec rhoncus neque ut
neque porta consequat.
In tincidunt tellus vehicula tellus. Etiam ornare nunc
vel lectus. Vivamus quis nibh. Sed nunc.
On FF1.5 and FF2.0, you need to wrap the contents of your
inline-block element in a DIV or P with fixed width to get line
wrapping.
These are SPANs with the goog-inline-block style applied, so you can style them like block-level elements. For example, give them 10px margin, a 10px border, or 10px padding. I used vertical-align: middle to make them all line up reasonably well. (Except on Safari 2. Go figure.)
This is what the same content looks like without goog-inline-block:
These are SPANs with the goog-inline-block style applied, so you can style them like block-level elements. For example, give them 10px margin, a 10px border, or 10px padding. I used vertical-align: middle to make them all line up reasonably well. (Except on Safari 2. Go figure.)
Click here to use goog.style.setInlineBlock() to apply the inline-block style to these SPANs.
Works on Internet Explorer 6 & 7, Firefox 1.5, 2.0 & 3.0 Beta, Safari 2 & 3, Webkit nightlies, and Opera 9. Note: DIVs nested in SPANs don't work on Opera.