親要素と子要素にborderが指定されている場合、
子要素のborderがIE6以下では表示されなくなります。
子要素がインラインレベルの場合は表示されます。
その場合、position: relative を指定するとOKです。
2009-04-15
2009-04-14
タイトルなどの表記でアルファベットをすべて大文字で書くと、
音声ブラウザでは1つの英単語という認識にならず、
1文字1文字を読み上げることになります。
見た目に大文字にしたい場合は、CSSで対応します。
text-transform: uppercase;
2009-04-09
CSSではかつてのTABLEタグと違って、
高さを揃えたり、センタリングなどに苦労することが多いです。
Javascriptをうまく活用することで、いろいろ工夫できるようです。
http://blog.webcreativepark.net/2007/07/26-010338.html
早くこういったレイアウト全般に対応できるCSSが
普及していって欲しいものです。
2009-04-08
ブログで画像を投稿するときに、想定した以上のサイズをアップされると
レイアウトが崩れてしまいます。
そんなときにはmax-widthが便利なのですが、
IE6には対応していません。
そこで便利なのが、minmax.jsというライブラリ。
http://www.doxdesk.com/software/js/minmax.html
headタグ内に読み込むだけでmax-widthやmin-widthが
使用できるようになります。
が、WordPressで試したところ、高さがautoでうまくいくものと
いかないものが出ていました。
なんとなくLightboxの絡みのような気がしたのですが、
とりあえず画像の比率が4：3ばっかりになると思ったので、
max-heightに数値を入れることとしました。
縦写真の場合がちょっと悩ましいかもです。。
2009-03-05
印刷したWEBページ上で改ページをしたい場合、
※ヘッダー
<STYLE type="text/css">
<!–
.break { page-break-before: always; }
–>
</STYLE>
※改ページしたい場所
<div class="break">
ここから改ページ
・
・
・
</div>
2009-03-01
文字を画像に置き換えたいときに使用する、
text-indentをマイナスにしてアンカータグをつけた時、
その領域をクリックしたときに表示される点線が
マイナス方向にも出てしまいます。（IEは出ない）
その場合、overflow:hidden を同時に入れると回避できます。
2007-07-26
CSSのクラスがどんどん増えていくとたまに気づかないミス。
aタグのクラス名、”link”, “visited”, “hover”, “active” は、”link”, “visited”, “hover”, “active” の順に指定。
hoverを上に書いたりするとCSSがうまく働かないので注意！