IEのブラウザだけちゃんと表示されません。

解決済

質問者：powron
質問日時：2008/11/20 23:23
回答数：3件

ウェブデザインをしています。

Macで制作して
サイトを立ち上げたのですが、
WindowsのIEにのみブラウザの下の方が
表示されません、、、。

http://www.hudge.jp/works/works.html

かなり困っています。

どうもheight: 100%;が適応されていないっていうのは
なんとなくわかったのですが、
どうやって直したらいいのかわかりません。

WindowsでもFire foxだと上手くいくのですが、、、。

CSSはこんな感じです。

<style type="text/css">
/* hide from ie on mac \*/
html {
height: 100%;
overflow: hidden;
}

#style {
height: 100%;
}
/* end hide */

body {
height: 100%;
margin: 10;
padding: 0;
background-color: #000000;
}

</style>

すいませんが、お願いします。

通報する

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

質問の本文を隠す

回答 (3件)

No.1

回答者： yyr446
回答日時：2008/11/21 12:57

IEで、Flash Playerは入ってますか？

この回答への補足

IEにFlashは入っています。

6.0も7.0も下の方の表示ができないです、、。

補足日時：2008/11/21 21:51

通報する

- 0
- 件

通報する

No.2

回答者： twinhourse
回答日時：2008/11/25 04:05

IE 8 Beta2のDeveloper ToolでIE7をエミュレートしてみると、<div id="style">の四方のmarginがautoになっているので、<div id="style">全体が大きく下にずれているようです（正確には右下にずれてます）。

だから、<div id="style">にmargin:0などをやってみてはどうでしょうか。

- 0
- 件

通報する

この回答へのお礼

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

margin:0に指定しましたが、
やはりIEのみだめでした、、、。

通報する

お礼日時：2008/11/25 16:01

No.3ベストアンサー

回答者： twinhourse
回答日時：2008/11/26 04:18

#2ですが、前のではだめでしたか。

自分のローカルにうまく再現はできなかったのですが、まず

* {
margin: 0;
padding: 0;
}

とでもして、全要素のmarginとpaddingをリセットしてみてください。そうすれば大分改善されると思いますが、されないかもしれません。

また、bodyのheightが100%なのに加えてmarginも設定されているので、上部のmargin分だけ下部が見切れてしまうのは当然だと思います。これは一つの提案ですが、htmlやbodyにはmarginやpaddingを0に設定し、body内の要素に対してmargin:10px;などを設定する形で再現してみてはいかがでしょうか。

あとは、他の部分を微調整してみたり、文法を整えてみたりしてみればいいんじゃないでしょうか（<head>が閉じてませんよ）。