タグ

ブックマーク / phiary.me (2)

  • phiary

    上揃えにする方法 上揃えはデフォルトですね. 何もしなくても上揃えになります. 今回のサンプルでは他の CSS に合わせるためにあえて 下記のようなコードを追加しています. #box1 span { position: absolute; top: 0; } 中央揃えにする方法 まずは中央揃えにしたいテキストの親要素に position: relative; を適応します. .box { float: left; position: relative; margin: 10px; width: 25%; height: 90%; border: 1px solid black; background-color: white; font-size: 2rem; line-height: 2rem; } そして中央揃えにしたいテキストの position プロパティに absolute を設

    phiary
    sonk
    sonk 2013/02/01
    html][css]
  • phiary

    今回は CSS3 から box-sizing について紹介します. width や height と同時に border や padding を指定しているときに, 少し値を変えただけで意図しない表示になったりレイアウトが崩れたという経験はありませんか? これはボックスサイズの算出方法が複雑なのが原因です. そんな面倒な問題を解決してくれるのが box-sizing プロパティです!! box-sizing プロパティを指定することでボックスサイズ(width, height) の算出方法を指定することができます. あまり普及していないようですが, 実はこれめちゃめちゃ便利だったりします!! まだ独自実装レベルだからかもしれません. ですが, 現在のCSS3 の草案にも 一応残ってるので, がっつり使わせて頂いてる次第です.

    phiary
  • 1