2016/12/28

要素を三等分にするスタイルシート

tags : / /

これは便利！

対応ブラウザ：IE9以降、Safari6以降、Google Chrome19以降、Firefox4以降

.3col {
  width : calc(100% / 3) ;
}

幅100%の3分の1サイズ！

念のため、ベンダープレフィックスを

li.3col {
  width : 33.33333% ; /* 未対応ブラウザ用フォールバック */
  width : -webkit-calc(100% / 3) ;
  width : calc(100% / 3) ;
}

 

  • このエントリーをはてなブックマークに追加

この記事に関連する記事

Profoile

coralqualia
HaraYohei http://coralqualia.com/

当サイトの運営者。 ビジネスを成功へ導くため、「思いをカタチに変える」お手伝いをします。 印刷物、WEBサイトの制作はもちろん、その他なんでもご相談ください。 少しでもお客様のお役に立てればと思っております。 【Service】 ロゴ/販促ツール制作/パッケージ/誌面/各種広告制作/看板サイン/各種印刷 WEBサイト企画立案/Webデザイン/Webサイト制作/CMS（WordPress）構築/ECサイト構築/サーバー運用管理/サイト運営サポート イラスト/キャラクターデザイン Wechatを活用したサービスの提供 /中国でのWEBサイト構築・運営・販促活動