FC2ブログ

雑記的な...

いろいろと勉強途中のドシロウトが書く雑記

スポンサー広告

スポンサーサイト

更新日時:--/--/-- --:--

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Web製作

overflowでborder-bottomが消えるバグ?(Firefox)

更新日時:2008/01/31 12:00

かなり前ですが2ちゃんねるで使うためにstylishのCSSを書きました。
すごく簡単なものなので投稿せずに自分用です。これを書いているときに見つけたFirefoxの不具合?

2ch用CSS

2ちゃんねるのスレッドはulで囲んであり、名前はdt、本文はddで囲んであります。それを成形してdtとddにborderを指定しました。

リンクなどの長い半角の文字列があると、ボックスの中を折り返さずにそのまま突き破ってしまいます。こんな感じに

http://hogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehogehoge.com

ごめんなさい、サイドバーに被ってしまいましたね。IE6以下の場合はIE独自プロパティで強制的に折り返さないと悲惨なことになるので折り返しています。

なので2ちゃんねる用CSSではそれを防止するためにoverflowにautoを指定しました。 autoにすればはみ出たときに自動的にスクロールバーを出してるようになります。

しかし、なんということでしょう。overflowにautoを指定した途端、下ボーダーがあるものがあったり、無いものがあったり・・・

2ch用CSS不具合

リスト中にoverflow:autoを設定するとランダム?に下ボーダーが消えます。なにか消える条件があるのでしょうか?必死に探したのですが結局分かりませんでした。<br />が奇数個あると消えるのか?とか無駄に考えてました・・・。まったく違いますが(笑

これはバグなんでしょうか?ためしにliでも試してみたらliでも同じようになりました。

リスト系だけがだめなんでしょうかね?しかしリスト以外にも発生するようです。「教えて!goo」で質問されていました。gooに書いているようにフォントサイズによって消えるボックスが変わります。ボーダーを1pxから2pxに変えると、消えるのではなく、1pxのボーダーとして出てきます。どうやらボーダーが無効化される訳ではなく、1px分だけ削られてしまうらしいですね。解決策が思いつかないのでoverflow:autoは泣く泣くコメントアウトしました・・・。

この件についてご存知の方がいましたら、ぜひご教授お願いします。

一応確認用ページを用意しておきました。

確認用ページ

追記

line-heightを1にすると消えるこの現象はおきませんが、1にはできませんよねぇ。

スポンサーサイト

コメント

コメント投稿後、編集や削除する可能性がある場合にはpassが必要になりますので、passを入力してください。また、ただ宣伝するだけのコメントと判断した場合は削除しますのでご了承ください。

コメントの投稿
管理者にだけ表示を許可する

トラックバックURL

トラックバック一覧

検索


WWW を検索
このブログを検索

Amazon


紹介

Firefoxのアドオン「Stylish」で使えるCSS作ってます。
こちら
stylishとは?

Mozilla Firefox ブラウザ無料ダウンロード

カレンダー

08│2018/09│10
- - - - - - 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 - - - - - -

Copyright © 2008 雑記的な... All Rights Reserved

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。