私が作成している Web ページでは、ページは PHP ベースの CMS によって動的に生成されます。CMS は、データベースからページのすべての情報を取得し、正しい HTML タグなどをページにエコーします。
私が抱えている問題は、何らかの理由でブラウザが終了タグを超えて div を拡張していることです。
IE: タグが閉じていることはわかりますが、ブラウザは表示されないため、そのdiv
中に適用されたスタイルはページ全体に適用されています。
以下はHTML出力です。(これはページの抜粋であり、ヘッダー div は永続的なものです)。
<div id="header">
<table>
<tr>
<td style="width: 10%;">
<img style="height: 120px; width: 101px;" src="img" alt="some alt">
</td>
<td>
<h2>Heading</h2>
<h3>Subhead</h3>
</td>
</tr>
<table>
</div>
<div id="menubar">
次回のオープニングも収録div
。
h2
とh3
の内部でスタイルを設定しようとすると、ページ上のdiv
すべてのh2
とh3
タグが影響を受けます。これが私のCSSです:
#header h2 {
font-size: 24pt;
font-weight: 900;
color: #776F65;
letter-spacing: 0;
line-height: 0;
}
#header h3 {
font-weight: 900;
color: #776F65;
letter-spacing: 0;
padding-left: 35px;
}
最後に、HTML 出力を生成するために使用する PHP コードを次に示します。
echo('<div id="header">'); // HEADER ELEMENT BEGINS HERE
while($row = mysql_fetch_array($getHeaderElements)) {
echo($row['content']);
}
echo('</div>'); // End Header Element.
使用しているブラウザは Google Chrome です。
この奇妙な動作が発生する理由を知っている人はいますか?
よろしく、ベン。