Written by
watanabe

ヘッダーとフッターを固定
CSSだけでヘッダーとフッターの位置を固定する方法をご紹介いたします。 ヘッダーとフッターは3行目の「position: fixed;」でスクロールしても位置が固定するようにし、4行目の「top: 0;」、18行目の「bottom: 0;」でそれぞれ上下に表示しています。中央表示は「width: 100%;」プロパティで実現させています。 コンテンツは「overflow: au...

Written by
watanabe

CSSだけでヘッダーとフッターの位置を固定する方法をご紹介いたします。 ヘッダーとフッターは3行目の「position: fixed;」でスクロールしても位置が固定するようにし、4行目の「top: 0;」、18行目の「bottom: 0;」でそれぞれ上下に表示しています。中央表示は「width: 100%;」プロパティで実現させています。 コンテンツは「overflow: au...
Written by
watanabe
Written by
watanabe
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」で改行するようにしています。 div...