advanced code snippet search

Posted By

adriamooney on 07/15/10


Tagged

height columns inline-block unequal


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

widgetyegg


inline-block with ie hacks for stacking columns of unequal height

 / Published in: CSS
 

URL: http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/

Expand | Embed | Plain Text 
  1. <style>
  2.     li {
  3.         width: 200px;
  4.         min-height: 250px;
  5.         border: 1px solid #000;
  6.         display: -moz-inline-stack;
  7.         display: inline-block;
  8.         vertical-align: top;
  9.         margin: 5px;
  10.         zoom: 1;
  11.         *display: inline;
  12.         _height: 250px;
  13.     }
  14. </style>
  15.  
  16. <li>
  17.         <div>
  18.             <h4>This is awesome</h4>
  19.             <img src="http://farm4.static.flickr.com/3623/3279671785_d1f2e665b6_s.jpg"
  20.             alt="lobster" width="75" height="75"/>
  21.         </div>
  22. </li>

Report this snippet  

You need to login to post a comment.