Firefox / バグメモ

Monday, Oct 24, 2005 - 17:01 +09:00

高いレベルでWeb標準をサポートした、優秀なブラウザ。
仕様に従う限り表示上の不具合は殆どないが、遭遇した場合は対応策が殆どない。
Mozilla系の独自拡張タグが使用可能。

ナビゲーションに謎の線が表示される
ナビゲーション・メニューを<ul>などでマークアップするとき、「text-indent」でテキストを画面外に退避させ、背景画像をもってナビゲーションをデザインする手法は広く知られている。ただしFirefoxでは<a>要素に「text-decoration:none」を指定していない場合、下線装飾が画面外まで追いかけていく。
基準ボックスの解釈が通常と異なる
絶対配置の包括要素に「position:relative」と指定し、基準ボックスとする方法に問題あり。firefoxで基準ボックスとなりうるのは<div>のみ（tableは不可）。また基準ボックスの幅に％を用いたとき、基準としたボックスではなく、その親要素の幅を基準とする場合もある。
input type="file"の幅が指定できない。

CSSのwidthでtype="file"の幅を指定することができない。正確には場所は用意されてるっぽいんだけど、肝心のフォーム要素が伸びてくれない。Firefoxでtype="file"を伸ばすには、HTML側のsize属性に頼る必要がある。

Mac版Firefoxでは少し趣が違って、widthの指定は効く ...が、パス表示フィールドにのみ適用される。ちょっと込み入っているようなので、下記に纏めてみる。

  • widthの指定は効く ...が、表示上のサイズには影響しない
  • widthの指定は、「text-align: center;」の基準になっている
    (60pxの<input type="text"⁄>と、60pxの<input type="file" ⁄>を「text-align: center;」で並べた場合、左端が綺麗に揃う)
  • 表示上のサイズは、size属性によって決定される
  • size属性の値は、パス表示フィールドに適用される
    (size属性が同じ値の場合、Firefox-winの「パス表示フィールド＋参照ボタン」と、Firefox-macの「パス表示フィールドの長さが等しい)

Firefox-macを考慮に入れる場合、size属性を少し小さめに入れる必要がある。ただしボックスを突き破ったからといって、レイアウトが崩れたりはしない（上に被さるか下に潜る）ようだ。Firefox-winを優先すべきだとは思うが、キツキツのデザインだとFirefox-macでボタンを押せなくなってまう事もあり、それは避けたいところ。

posted in HTML/CSS Trackback (0)

Trackback

このエントリーのトラックバックURL
http://rospear.info/other/mt-tb.cgi/44

« Previous Entry - Next Entry »