Revision: 10923
Updated Code
at January 18, 2009 15:52 by Tate
Updated Code
.wrap { display: table; height: 400px; #width: 175px; /* arbitrary width for IE only */ #position: relative; /* for IE only */ overflow: hidden; } .inner { #position: absolute; /* for IE only */ #top: 50%; /* for IE only */ display: table-cell; vertical-align: middle; } .content { #position: relative; /* for IE only */ #top: -50%; /* for IE only */ } .wrap, .content {border: 1px solid green;} /* just borders to see it */ p {padding:5px;} <div class="wrap"> <div class="inner"> <div class="content"> <p>Any content vertically centered.</p> </div> </div> </div>
Revision: 10922
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at January 18, 2009 14:59 by Tate
Initial Code
display:table-cell; vertical-align:middle
Initial URL
Initial Description
Initial Title
Vertical Align in a div
Initial Tags
Initial Language
CSS