過去に出会ってしまったバグのメモ。
変なところで折り返し(自動改行)される
ブラウザの自動改行の設定がONになってるせいで起こる。
横幅の値を指定してもだめだけど、背景色や背景画像を設定すればなぜかなおる。
.sample {
background: #FFF;
}
CSS3がきかない
ベンダープリフィックスつけてみる。
PCだといらないけどスマホだと必要なやつ
- box-shadow ... 2.×系とFirefoxブラウザは必要
- box-sizing ... 2.×系とFirefoxブラウザは必要
- border-image ... 必要
linear-gradient
は書き方注意
○ OK -webkit-gradient(linear, …)
× NG -webkit-linear-gradient(…)
背景画像がおかしい
Androidで background-attachment:fixed
は使えないので注意。
太字にならない
font-weight
は無理なのでtext-shadow
でがんばる。
Webフォントが使えない
Basic認証を切ればいけるかも。
ダウンロード・アップロードに失敗する
これもBasic認証を切ればいけるかも。
もしくは保存先の容量がいっぱいで保存できないケースかも。
apple-touch-icon が出ない
これもBasic認証を切ればいけるかも。
positionで重なってる要素に対して、下にある要素がタップで反応してしまう
2系ではz-indexをいくら指定しても効いてくれない。
JSをごりごり書けばいけるらしい。
最悪、デザインの方を重ならなくてもいいよう変更してもらったり。
iframe内の表示がおかしい
あきらめる。