1

私の HTML ページ (ページの左側) には 4 つのリンクがあります。リンクをクリックしているときに、リンクごとに関連する div を表示および非表示にする必要があります。

最初のリンクをクリックした場合、ページの右側に最初の div を表示する必要があります。もう一度、2 番目のリンクをクリックした場合、最初の div の後に 2 番目の div を表示する必要があります。

これを行うために、これらすべての div を左に揃えました (スタイルが "float:left" の場合)。これは Firefox と IE で正しく動作しています。ただし、Google Chrome では機能しません。これらの div はすべて、1 つずつではなく、クロムの同じ位置に表示されます。

誰かが有用な答えを与えることができれば、本当に感謝しています。ありがとうございました

4

1 に答える 1

1

これらの 4 つの div すべてを別の div (コンテナ) 内に配置し、div を含む幅を 4 つのダイブと同じか、2 ~ 3 ピクセルだけ大きく設定してください。このような:

<div id="container" style="width: 202px">
    <div id="inner1" style="width: 200px; float: left"></div>
    <div id="inner2" style="width: 200px; float: left"></div>
    <div id="inner3" style="width: 200px; float: left"></div>
    <div id="inner4" style="width: 200px; float: left"></div>
</div>

フロート配置を使用する場合は、常にコンテナ div を使用する必要があります。これにより、内部 div を配置するために必要な正確なスペースがブラウザに通知されます。コンテナーなしでフロートを使用すると、どのブラウザーでも予測できない結果が生じる可能性があると常に言われていました。

于 2012-06-25T11:29:56.120 に答える