2012年7月4日 星期三

absolute position的水平&垂直置中

http://birdegg.wordpress.com/2007/12/06/absolute-position的水平垂直置中/

在一已知 height & width 的 element,這個技巧蠻不錯的,原理是先設定 top: 50%; left: 50%;,設定 element 的寬與高 height: 18em, width: 30em,再利用 negative margin 把 element shift 寬/高的一半 margin-left: -15em; margin-top: -9em
  
vcard {
    border:1px solid #666666;
    height:18em;
    left:50%;
    margin-left:-15em;
    margin-top:-9em;
    position:absolute;
    top:50%;
    width:30em;
}
  

沒有留言:

張貼留言