IE6にもmin-heightを疑似的に実現させる方法｜web bibo
IE6はmin-heightが使えないのですが、Javascriptを使わず、CSSだけを使って簡単にmin-heightを実現する方法がありますので、ご紹介します。 min-widthを指定したい場合は、「IE6とモダンブラウザにmin-widthを疑似的に指定する方法」をご覧ください。 HTMLコード <div>テキストテキストテキストテキスト</div> 今までは下記のようなCSSハックを使ってmin-heightを実現してきました。 今までのmin-heightを実現させる方法 div { /*全ブラウザに適用*/ height: 150px; } html>body div { /*モダンブラウザに適用*/ min-height: 150px; height: auto; } ですが、もっとスマートに簡単なコードで実現できる方法を紹介します。 スマートに簡単なコードで実現させる方
CSSでボックスの内容物を上下中央揃えにする方法3種。｜web bibo
↑CSSだけでこんな感じに上下中央揃えを実現させるテクニックです。下記の3つの方法を紹介します。 ・1行のみのテキストを中央揃えにする場合 ・2行以上のテキストまたは画像を中央揃えにする場合 ・高さが決まっていない要素を中央揃えにする場合 1行のみのテキストを中央揃えにする場合 <!-- HTML --> <div> <p>1行のみのテキストに有用</p> </div> /* CSS */ div{ width: 200px; height: 100px; background: #DDDDFF; text-align: center; } p{ line-height: 100px; } →1行のみのテキストを中央揃えにするサンプル line-heightは行間のスペースを制御するプロパティです。なので、2行以上の文などには利用できません。1行だけの場合には簡単に実装できる有用な方法です
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
