FFとIEでスクロールバー、背景画像を表示しセンタリングするときのズレ

解決済

質問者：fugur
質問日時：2008/12/30 00:49
回答数：2件

IE7とFF3とOpera9で表示確認をしています。

スクロールバーを常時表示し、背景をセンタリングしたデザインをしたいと考えています。
FF3でスクロールバーを表示すると、背景よりボックスが1px右にずれてしまいます。

IEはもともとずれるのが判っているのでハックを使って調節しています。
Operaだと理想どおりに表示されます。
仕方が無いのでFFもハックして表示しました。

ソースは以下のとおりです。
実際こんなにハックしなくとも、スマートに表示できる方法があるのでしょうか？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title></title>
<style>

</style>
</head>
<body>
<div class="base">
<p>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

</p>
</div>
</body>
</html>

何かわかることがありましたら、よろしくお願いしたします。

※添付画像が削除されました。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： reggaepunc
回答日時：2008/12/30 01:07

一般的には、bodyに背景を設定するとズレます。

なので、一番簡単な方法はdivでくくって、divに背景を設定しましょう。
これで解決するはずです。

あとは。背景画像にどんなものを使っているのかわからないので、
なんともいえませんが。。

divを余計に増やすようでいやな感じがするかもしれませんが、
divが一個増えたからといってページランクが落ちることはまずないでしょう。

この回答への補足

早速のご回答ありがとうございます。

背景画像はこちらです。
ttp://eea.sessya.net/bg4.jpg

divでくくるとずれないということは知りませんでした。
早速、試してみることにします。

補足日時：2008/12/30 01:23

通報する

- 0
- 件

通報する

No.2

回答者： taloo
回答日時：2008/12/30 09:30

html, body{

margin: 0;
padding:0;
border: 0 none;
}

<html>にもmarginとpadding、それに念のためborderを指定
でどうでしょうか？

私はこの２行を必ず書いてます。
背景画像は必ずと言っていいほどbodyに指定していますが、背景が1pxずれるなどの状況に遭遇したことはありません。

*{margin:0;padding:0}
body{background-color:white;color:black;}