What is Inline-Block?

If you’ve been developing with CSS for some time now, you’re certainly familiar with the inline-block value for the display property. The most common use for this property/value pair is when getting IE6′s margins to behave.

To briefly explain what I’m talking about, if you float an element in IE6 and give it a margin setting on the same side as the direction of the float, the margin will (strangely) be doubled. You could fix this with an IE6 hack with a margin setting that’s half the value of the original, or you could (in many cases) give the element’s display property a value of inline-block (again in an IE6-only hack or stylesheet). This will resolve the issue in most, if not all circumstances.

Although this IE6 workaround for floated elements has probably been the most useful way to implement the inline-block value, it could serve a much more legitimate purpose if the value itself is better understood.

This post was generated by an RSS Feed from Impressive Webs

You may also like to read:

• Randomized Grid of Posts
• Center Multiple DIVs with CSS
• Word-Wrap: A CSS3 Property That Works in Every Browser
• How to Build a Top Sliding Login Panel
• 10 CSS Snippets to Save Precious Time

(No Ratings Yet)

 Loading ...