reset.cssについて

Yahoo!のリセットCSSを使ってみて気になったこと。
（しょーもない話）


<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.6.0/build/cssreset/cssreset-min.css">

cssreset-min.css　では

html　{color:#000;background:#F00}

という指定がされている。
このリセットCSSを使用した場合


html,body {height:100%;}

と設定したとき、ウィンドウサイズよりコンテンツが広く、隠れているコンテンツを表示させるためにスクロールした時、新たに表示される画面の背景が白くなる（背景が途切れているように見える）

※そもそも　height:100%　を設定するのはウィンドウサイズいっぱいにリキッドレイアウトでコンテンツを配置したい（フッター要素を画面下部に固定したいとか）場合なので今回は必要でなかった。


body の指定　height:100%;　を無くせばスクロール時の白い背景はでなくなるが、ウィンドウサイズを広げたとき、コンテンツの縦がウィンドウサイズより小さい場合、広げた領域に　background:#F00　の影響がでる（白くなる）

cssreset-min.css　が修正できる状態なら

html　{color:#000;}　

として背景指定を無くせば　body　での指定が有効になる。

修正できない場合は　別CSSファイル内で　backgroundプロパティを上書きする。

html　{color:#000;background:none;}


その上で body　の設定を記述する。


body {background:#d0d0c8 url(../img/back.png) fixed no-repeat center top;}