Written by
watanabe
min-heightをIE6で実現
min-height(高さの最小値)をCSSのみでIE6でも実現する方法をご紹介いたします。 下記のソースはサンプルで使用しているCSSで、min-heightに直接関係している部分だけを抜粋しています。 2行目で記述されているのは、普通の「min-height」プロパティです。3行目の「height: auto !important;」は4行目の「height: 150px;...
HOME > 開発者向けBLOG
Written by
watanabe
min-height(高さの最小値)をCSSのみでIE6でも実現する方法をご紹介いたします。 下記のソースはサンプルで使用しているCSSで、min-heightに直接関係している部分だけを抜粋しています。 2行目で記述されているのは、普通の「min-height」プロパティです。3行目の「height: auto !important;」は4行目の「height: 150px;...
Written by
watanabe
半角英数字が連続した場合に、突き抜ける現象を防止する方法をご紹介いたします。 まず、ブロック要素である「div.box」に幅を指定します。div内にあるp要素の「p.beak」に「word-wrap: break-word;」プロパティを指定します。「word-wrap」は単語の途中で改行するかどうかを指定するもので、「break-word」で改行するようにしています。 1 2...
Written by
watanabe
背景色(画像)をページの左右に伸ばす方法をご紹介いたします。 背景を横に伸ばすだけならそれほど難しくはありませんが、大抵は幅を指定して固定する要素があると思いますので、固定する要素を含んだ構成で作成します。 大きくわけて2つの要素で構成します。 背景色(画像)を指定するdiv 幅を指定し、固定するdiv 「div.content_area」では「background: #FF5...
Written by
watanabe
Written by
watanabe
1文字のぶら下がりインデントをご紹介いたします。 注釈「※」の行の後は、通常1文字分のインデントをされることが多いと思います。その表現を実現する際、テーブル要素、フロートをかけるなどの方法がいくつかありますが、全てのブラウザに対して完璧ではないものの、CSSで実現することができます。 ul要素とp要素を例にしてみます。ul要素では「ul.hang」に「width: 300px;...
