私は学習の練習として何かしようとしてきましたが、これはかなりシンプルだったはずですが、IE 8.私はちょっとしたダイアログのように見えるWebページを、タイトル要素、本文、およびOKとCancelボタンのあるフッターで描画しようとしています。以下は、Firefoxでうまくいく単純な例です(今はボタンがありません)。ウィンドウの左上に小さな正方形が表示されます。もちろん、IEはそれを巨大な全幅と高さの四角形として描きます。重要なのは、私は幅を指定したくないということです。なぜなら、このレイアウトをさまざまなデータで何度も使用することを計画しているからです。設定のズーム:1を設定してから*表示:インラインを追加することについてのコメントがありましたが、動作させることはできません。かなり簡単な解決法はありますか、あるいは私はただテーブルをあきらめて使用するだけですか?おかげインラインブロックに関するもう1つの質問と、IEとFirefoxなどが同じように動作するようにする方法
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>HI THERE</title>
<style>
.dialog {
background: red;
display: inline-block;
zoom: 1;
*display: inline;
}
.dialog-title {
background: blue;
margin: 10%;
}
.dialog-item {
background: yellow;
clear: both;
}
.dialog-footer {
background: green;
margin: 10%;
}
.dialog-ok {
display: inline;
float: left;
background: black;
}
.dialog-cancel {
display: inline;
float: right;
background: brown;
}
</style>
</head>
<body>
<div class="dialog">
<form>
<div class="dialog-title">DIALOG TITLE</div>
<div class="dialog-item"><input type=text name=item1 size=20 value="ITEM1" /></div>
<div class="dialog-item"><input type=text name=item2 size=20 value="ITEM2" /></div>
<div class="dialog-footer">
<div class="dialog-ok">button1</div>
<div class="dialog-cancel">button2</div>
</div>
<div style="clear: both;"></div>
</form>
</div>
</body>
</html>
はあなたの先生ありがとうございました!とてもシンプルだが、CSS noobsが理解するのは難しい。 – Matt