Written by
watanabe
Written by
watanabe
Written by
watanabe
背景色を下部まで要素がない場合でも、下まで伸ばす方法をご紹介します。 通常、ブロック要素のdivタグなどにbackgroundで背景色を指定した場合、要素がある分までしか背景色は伸びません。これをCSSで要素がない場所(下部)まで伸ばしてみます。 ルートである「html」と「body」要素に「height: 100%;」を指定、min-heightに対応していないブラウザ用に「...
Written by
watanabe
左と右どちらのカラムが伸びても、カラム間にある線も同時に伸びる方法をご紹介いたします。 テーブル要素やjavascriptなど、方法はいくつかありますが、ここでは背景画像で実現させてみます。 カラムは3つ使用しています。 大枠(背景画像を使用するカラム) 左カラム 右カラム 「div.border」は左右カラムの親にあたるdivに指定します。「div.border」は横幅を設定...
Written by
watanabe
画像の横幅や高さが変わっても画像の下にテキストが回り込まない方法をご紹介いたします。 サンプルでは画像とテキストはp要素でマークアップしていますので、p要素が元々持っているマージンやパティングを消去します。 「div.img_box 」では画像とテキストを入れるボックスの幅や適当なスペースを指定しています。「div.img_box p」の「overflow: hidden;」で...