标签：
? ??? ????? ???? ???? vertical-align ??? ??? ? ???
? ? ? ????. (???? vertical-align ??? ?? ?????? ??? ??? ????.)
?? ??: ?? “???? ????? ? ???” ?? ???? ????. ???? ??? ? ?? ??? ???? ????? ???? ??? ???. ??? ??? ??? ?? ?? ?? ?? ?? ??, ???? ???? ??? ??. (?? ?? ??? ???? ???? ?? ?? ??.)
? ???? ???? ???? ??? ??? ??? ????? ???? ???? ??? ??? ???. ?? ?? ?? ???. a? display:block;? ???
? display:inline;? ?? ?? ??? ????. 9
[?? ? - ? ?? ?? ??? ??? ? ?? display: table ?? display: inline-table? ??? ?? ??.]
#wrapper {display:table; height:100px; border:1px solid red; width:400px; text-align:center;}
#cell {display:table-cell; vertical-align:middle; border:1px solid blue;}
??
??? ??? ????. (CSS? ??? ???? ??? ??.)
wrapper? ??? ??? ??? ??? ???.
??
??? ??????? ???? ???. (??? IE8 ?????.)
?? ??? ????. (??? ?? ? ???. ?? ???? ????.)
??2:
? ??? position absolute? ????. top? 50%? ???? margin-top? ???? ?? ???? ??? ????. ??? ??? ??? CSS?? ???? ??? ? ????.
??? ??? ?? ???, ??? ??? div ??? ?????. ??? ????? ???? ??? div? overflow:auto;? ?? ?? ???.
#content {position:absolute; top:50%; border:1px solid red; height:240px; margin-top:-120px; /* negative half of the height */}
??
?? ?????? ????.
??? ?? ???? ???.
??
??? ??? ??? ??? ???. (div? body ?? ??, ???? ???? ?? ???, ????? ???? ???.)
CSS ?? ??? ?? (??? ??!) Vertical Centering with CSS
标签：
原文地址：http://www.cnblogs.com/jweb/p/4611166.html
