Archive for css bug

IE7でzoomした時のbackgroundの動き

IE7でズームさせた時にbackgroundが一緒に拡大してくれなくて、困ることがたまにあったんだけど何でだろうと思いつつその場しのぎでどうにかしてました。

その現象は以下の2つの条件で起きる模様。

  1. bodyにbackgroundを指定した時
  2. インライン要素に指定した時

(1)bodyにbackgroundを指定した時
拡大しません。bodyに設定したbackgroundに依存したデザインやコーディングをすると拡大した時にレイアウトが崩れちゃう可能性大。
実はコーディングコンテストのコーディングをしてる時に気づいたりしました。

(2)インライン要素に指定した時
<a>とかにbackgroundを指定して、外部リンクにアイコンをつけたり、パンくずに「>」をつけたり、そういうことを結構していたのですが、拡大しても大丈夫な時と駄目な時があってなんでだろうと思っていたんです。
検索してみても、そんなことを書いてあるページにたどりつかなかったので、ちょっと実験。

スクロールすると背景が消える

最近めっきり完全放置プレーだったので久しぶりに書こうと思ったんですがネタもないので仕事のメモ書きでも残そうと思います :oops:
IE6,IE7でスクロールすると背景が消えてしまうことがたまにあって、ずっと気になっていたんですが、スクロールしなければちゃんと見えるしと思っていつものように放置プレーしていました。

背景をつけたブロック内に、フロートさせたブロックがあると、そのブロック部分の背景が消えるようです。ie6, ie7で確認しています。ie7では、その条件下でさらに背景を付けたブロックにpaddingを入れた部分だけが消えるようです。控えめです。ただし、ie6ではフロートさせたブロック部分全てを消し去ってくれます。

ie6やie7でスクロールをすると背景が消える? | Melanges より引用

そうだったんだぁ~ :D
というわけで、早速試してみたらその通りちゃんと直りました :lol:
いつかまた同じことで悩みそうだったのでメモ書きメモ書き :oops: