テーブルのvalignとFireFox
レイアウトチェックを行っている時に気付きました。 FireFoxというブラウザーでは、tableタグのvalignが効きませんでして、
valign="bottom"
なんて書いても無視されます。 いや、正式にはvalign="top"のような感じで描画される模様。 当サイトは下揃えをしている部分が一ヶ所だけあるので、これが崩れると総崩れになってしまいます。 解決策は無いものかとあれこれ調整してみましたら、スタイルシートで
position: absolute; bottom: 0
を指定してあげればオッケー。 但し、これを素で行うとFireFox以外のブラウザー上でとんでもない事になるので、ブラウザー判別してFireFoxだけに適用させます。
<script type="text/javascript">
if(navigator.userAgent.indexOf('Firefox') != -1){
document.write('<style type="text/css" media="screen">.firefox1 { position: absolute; bottom: 0 }</style>');
}
</script>
テーブルの方は
<table class="firefox1">