We Recommend

CSS: The Definitive Guide CSS: The Definitive Guide
Provides you with a comprehensive guide to CSS implementation, along with a thorough review of all aspects of CSS 2.1. Updated to cover Internet Explorer 7, Microsoft's vastly improved browser, this new edition includes content on positioning, text wrapping (nowrap), lists and generated content, table layout, user interface, paged media, and more.


Posted By

stylizedweb on 02/08/08


Tagged

div css align vertical


Versions (?)


Who likes this?

5 people have marked this snippet as a favorite

basicmagic
jonhenshaw
SpinZ
seekup00
isaac


Vertical align div


Published in: CSS 


URL: http://stylizedweb.com/2008/02/01/vertical-align-div/

the best solution for vertical align

  1. <div id=”shim”/></div>
  2. <div id=”wrapper”>
  3. Content
  4. </div>
  5.  
  6. html, body {
  7. height: 100%;
  8. margin: 0;
  9. padding: 0;
  10. }
  11.  
  12. * {
  13. margin:0px auto;
  14. padding:0;
  15. }
  16.  
  17. div#shim {
  18. visibility: hidden;
  19. width: 100%;
  20. height: 50%;
  21. margin-top: -200px;
  22. float: left;
  23. }
  24.  
  25. div#wrapper {
  26. width: 1000px;
  27. height: 400px;
  28. clear: both;
  29. background:red;
  30. position: relative;
  31. top: -200px;
  32. /* IE4ever Hack: Hide from IE4 **/
  33. position: static;
  34. /** end hack */
  35.  
  36. }
  37.  
  38. /* Hide from IE5mac \*//*/
  39. div#shim {
  40. display: none;
  41. }
  42.  
  43. html, body {
  44. height: auto;
  45. }
  46. /* end hack */
  47.  
  48. /* ]]> */

Report this snippet 

You need to login to post a comment.