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/

  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.