Archive for the BugBugBug Category

BugBugBug : IE – バグリスト

2007.09.02 Category : BugBugBug

[ floatとpadding-top ]

floatしてる要素にpadding-topが指定してあり、背景画像による罫線を上にひくと(背景画像を使ってると)、中にあるa:hoverの挙動がおかしい。paddingが増える模様。

[ 文字のないリスト要素 ]

IEだと文字列が存在しないリスト要素の行ボックスの高さに不具合がでる。

[ Measure ]

li.className{
width:000px;height:000px;/*imgと同じサイズを指定*/
line-height:0;
vertical-align:bottom;
font-size:0;
}

BugBugBug : Safari – バグリスト

2007.09.02 Category : BugBugBug

1. フォント指定はアルファベットで
→ "Hiragino Kaku Gothic Pro"など、ファミリー名で指定すれば、ボールドを持つ書体ならfont-weight指定でもバグらない。

2. a:hover{ text-decoration : underline } が上手く機能しない
→ 特定のフォントで、フォントサイズが12px以下で発生する。font-family : sans-serif; (serifも)としておけば回避。ちなみにSafariでのsans-serif指定時のアルファベットはLucida Grande。
→ あと<a>指定したテキストに<br />2回指定しても回避。

3. line-heightを指定したブロック要素内が、匿名でないインライン要素だけで構成されているとline-heightが無視される。
→<p style="line-height : 2em"><span>テキスト内容</span><p>
といったときはline-heightが無視される(Operaも同様)。

→<p>テキスト1<span>テキスト2</span>テキスト3</p>というコードの場合、"テキスト1"と"テキスト3"が匿名インライン要素。

BugBugBug : Opera-8 &#8211; @charset

2006.09.20 Category : BugBugBug

本来なら外部cssの@charset記述が正しくない場合は、その部分のみを無視することになっている。
→ Opera8以下では、その外部css自体を無視してしまう。
@charset Shift_JIS; とか @charset "Shift_JIS" など、ダブルクォーテーション忘れ、セミコロン忘れで完全に無視される。

BugBugBug : NN4.x &#8211; 外部CSS内のファイルパス

2006.09.05 Category : BugBugBug

外部CSSで背景画像を指定すると、相対リンクの場合表示されない。
呼び出されたhtmlページが基点となるため。

[ Measure ]
→ NN4.xまで考慮するなら外部CSSの背景画像指定は絶対パスで。もしくは別ファイルを用意。

BugBugBug : Safariでのbold指定バグ

2006.07.23 Category : BugBugBug, CSS

1. Safariでのフォント指定はアルファベットで

[ oh! 1 ] Font Book の表示名で指定(ウェイトあり)
font-family:”Hiragino Kaku Gothic Pro W6″; → 無視
表示:ヒラギノ角ゴProW3(ブラウザのフォント指定を無視)

[ oh! 2 ] Font Book の表示名で指定(ウェイトなし)
font-family:”Hiragino Kaku Gothic Pro”; → ○

[ oh! 3 ] Font Book のポストスクリプト名で指定
font-family:”HiraKakuPro-W6″; → ○

2. ボールド指定はバグる

Safariでのボールド指定時の基本動作(Safari1.3.2):
ボールド指定をすると、cssでのフォント指定もブラウザでのフォント指定も無視して、
日本語 → ヒラギノ角ゴシックW3 半角英数字 → Helvetica での表示になる。
※Helveticaはこちらの環境に左右されている可能性もあり。Font Bookで使用停止にしたときの挙動で確認。(英語版のSafariのデフォルトフォントがLucida Grandeという情報もあり)

[ oh! ]
Mac OSX + Safari 環境で日本語にボールド指定をかけたいときは、
ヒラギノ角ゴシックをファミリー名で指定する。
※この場合、通常はW3が使われ、ボールドはW6が使用される。
半角英数字の場合は、ボールドをデフォルトで持っているフォントを指定する。

CSS : Safari1.xtext-decoration:underlineが効かない

2006.07.17 Category : BugBugBug
<p>の最終行などで、明朝体やヒラギノ角ゴシックなどを使っていても

a:hover{
text-decoration:underline;
}
が上手く働かない。(a:hover自体は有効。Osakaなら問題なし)

[ oh! ]

<a>を適用しているテキストに改行2つ追加