DreamWeaver MX を使用して Web ページを作成しています。ネストされたテーブルを使用します。1 行 1 列 (W = 99%、H = n ピクセル) の 1 つのメイン テーブルと、繰り返しパターンの背景画像。2 番目のメイン テーブル (幅 = 990 ピクセル、高さ = n ピクセル) が最初のメイン テーブルの内側に挿入され、中央に配置されます。これは、ページが 990xn ピクセル以上のすべての画面に収まり、背景画像によって適切な境界線が作成されるようにするためです。
2 番目のメイン テーブルには 3 つのゾーンがあります。上部のヘッダー ゾーン (2 番目のメイン テーブルと水平で同じ幅)、左側のメニュー ゾーン、右側のテキスト ゾーンで、他の 2 つのゾーンよりも大きくなっています。また、ヘッダー ゾーンに挿入された 1 行 3 列の小さな水平テーブルもあります。これには、写真とヘッダーのテキストが含まれます。他にも小さな表がいくつかあります。メニューの下部にあるメニュー ゾーンに挿入された 1 つは、3 つの [このソーシャル ネットワークをフォローする] ボタンを含めるために、1 つまたは複数の小さな表は写真を含めるためにテキスト ゾーンに挿入され、1 つの小さな表は、 Disqus コメントを含めるためのテーブル。
すべてがうまく機能していました。私のサイトのすべてのページは、Chrome、Firefox、IE8、および IE9 で希望どおりに表示されました。次に、いくつかのページに Disqus コメント システムを挿入しました。Disqus コメント システムのページは、Chrome と Firefox では適切に表示されましたが、IE8 と IE9 では表示が乱雑で、コメントがすべての幅を占め、Web ページのコンテンツの大部分が消えてしまいました。
IE8 と IE9 で Disqus コメントを正しく表示するために、Disqus コメントを含む Web ページの最初の行に移行用の Doctype 宣言のコードを挿入しました。このアクションにより、Chrome、Firefox、IE8、および IE9 で Disqus コメント システムを正しく表示できるようになりましたが、現在、すべてのブラウザに小さな問題があります。 2 番目のメイン テーブルと最も近いテキスト行 (これは追加の水平パディングのようなものです。最初の垂直および水平パディングは変更されません)。これらの望ましくない空白のそれぞれは、段落区切りのサイズを持っています。
問題を視覚化できる 2 つの URL を次に示します。
- Doctype 宣言を含まない私のサイトhttp://pikpratik.com/のホームページでは、非表示のテーブル セル行と最も近いテキスト行の間のスペースは問題ありません。
- ページhttp://pikpratik.com/fichye/pou_redui_risk_viktim_aksidan_sou_wout.htmの上部に、特にヘッダー (セル行が見えない) とテキストの最初の行 (Akèy > Jesyon risk ak dezas >) また、テキストの最後の行 (Akèy | Kiyès nou ye | Di sa w panse de sit sa a | Plan sit la | Kontak) と 2 番目のメイン テーブルの下の境界線の間。
重要な注意: 移行用の DOCTYPE 宣言コードと Disqus コメント システムをページから削除すると、テーブルはすべてのブラウザーで正しく表示されます。
私の質問は、これらの空白を削除するにはどうすればよいですか?
CSSの使い方がわかりません。CSSなしで解決策を教えてください。利用可能な唯一のソリューションに CSS が含まれている場合は、完全なコードと、Web ページにコードを挿入する必要がある正確な場所を教えてください。