mozilla
border-collapse:collapse;を指定したtableが左にズレるバグ
FireFoxでサイトを確認したとき、border-collapse:collapse; が指定されたtableが親要素から左に1pxずれるバグがありました。
原因がイマイチ分かりませんが、おそらくmozillaのバグなんでしょうね。
ここにも載ってました。
http://bugzilla.mozilla.gr.jp/show_bug.cgi?id=4246
しかも解決済みだということですが、いまだに直らないってことは解決していないのでしょうか??
それともこちらのマークアップにミスが!?
こんな構造になっていようが、
にしようが、ずれるもんはずれるんです。
結局、ボーダーをtableに指定しないで、tableをdivで囲ってあげてそのdivにボーダー指定するか、
FireFoxだけ、border-collapse:collapse; を指定しないかで解決したんですけどね。
うーん。。
FireFox3のフルページズームに関するバグ?
親ボックス内3カラムの子ボックスをフロートで配置したレイアウトの場合に、FireFox3のフルページズームの縮小を行うと3カラム目のボックスが落ちる現象を確認。
原因をネットで探してみた中で、解決に一番近い情報が確認できたサイトが、Firefox 3 のフルページズーム使用時はスクリーン上でのピクセル量とCSS上でのピクセル量 なのだが・・・・
・親ボックスの横幅に対して、3つの子ボックスそれぞれにも横幅が指定され、合計で親ボックスの全幅となる。
・float:left; float:left; float:right; で配置。
・フルページズーム機能の縮小の場合のみ、3カラム目が下に落ちる。
とりあえず、ボックスのカラム落ちを回避した方法は・・・
子ボックスの幅をどれかひとつ数ピクセル縮める。
カラム落ちする場合の縮小したイメージをよく見ると、どうやら余白やコンテンツ幅のpx指定がうまく効いていないっぽいことでレイアウトが崩れている。
フロートの解除に関するスタイル指定のミスではなかったので・・・・
これでいいのだろうか??
FireFox3のズーム機能で縮小するとレイアウトが崩れる
floatで配置した3カラムデザインのうち、FireFox3のズーム機能を使って(テキストのみのズームではない)一番右のカラムが下に落ちてしまった。
ボックス内の全幅は500pxとして、CSSで150px 200px 150pxと指定していた。
それぞれ、float:left; float:left; float:right;で配置していた。
どうやら縮小するとwidthの解釈がおかしくなるらしい・・・
この問題を解決するために、真ん中のカラムの幅を1px減らして199pxにしてみたら直った。
はたしてこれで問題解決になってるのだろうか???
カテゴリー
- browser (22)
- Chrome (2)
- Fire Fox (12)
- Internet Explorer (13)
- webkit (1)
- css (8)
- design (1)
- History (5)
- html / xhtml (5)
- JavaScript (2)
- Links (1)
- memo (3)
タグ
confidelic-logについて
アーカイブ
日 | 月 | 火 | 水 | 木 | 金 | 土 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |