Monday, December 7, 2009

Cross-Browser Inline-Block

yesterday i was trying to inline 5 images into ul tag but i found the ie8 doesn’t support display: inline-block; so i google for across browsing code for this issue and i found this css. it solve this issue in ie and firefox versions

image

<style>
    li {
        width: 200px;
        min-height: 250px;
        border: 1px solid #000;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 5px;
        zoom: 1;
        *display: inline;
        _height: 250px;
    }
</style>

5 comments:

  1. That's not true. IE8 supports inline-block as a display type. Maybe your browser was switch to compatibility view?
    ReplyDelete
  2. Sweet workaround, thanks this saved me from embarrassment in front of my bosses.
    ReplyDelete
  3. *display: inline;

    thanks.
    ReplyDelete