2010/02/15

CSS width in box module

今天遇到的鳥問題:CSS 中真正的 width 要等於 margin + border + padding + 設定的 width。

假設原本的 DIV 設定如下:
.box {
   width: 800px;
}

若要讓原本的區塊寬度不變但要加上 20px 的 padding 必須這樣設定:
.box-padding {
   padding-left: 20px;
   padding-right: 20px;
   width: 760px; /* 800 - 20 - 20 = 760 */
}

3 則留言:

  1. 你可以試試 LESS。

    http://lesscss.org/

    我沒試過,你試看看:P

    回覆刪除
  2. LESS 感覺超威的! 0.0+

    回覆刪除
  3. 現在有 Compass 了!

    回覆刪除