CSSで四則演算をする

Category :

calcファンクションとは

CSS3で実装された計算用のファンクションで、パーセンテージ指定した値から、指定ピクセル分を引くことができます。 また、面倒な計算をせずとも要素を均等に横並べすることもできます。

calc(式)とするだけ。

要素を3つ均等に横並べしたいとき

.col1, .col2, .col3 {
width : -webkit-calc(100% / 3) ;
width : calc(100% / 3) ;
}
100% から20px引きたいとき
.hoge {
width : calc(100% - 20px) ;
}
TOP
© 2021 uichi