0

DIVを3つだけ重ねたい。それは多くのコードではありません、そして私がコンテンツなしでそれを明白に行うとき、それは適切にスタックします。私が間違っていることはわかりませんが、ここにコードがあります。真ん中のコンテンツDIVの下にもう1つDIVが必要です。これは、下部の情報バーに使用されます。私z-indexは、レイヤーにもっと使用されており、私の知識には有益ではないことを理解しています。

これが私のHTMLコードです：

<html>
<head>
    <title>Mt. Rose, City of Refuge MEdia</title>
    <link rel="stylesheet"
          href="storage/mainsite/styles/default_button.css" type="text/css">
    <link rel="stylesheet" href="storage/mainsite/styles/default_font.css"
          type="text/css">
    <link rel="stylesheet" href="storage/mainsite/styles/default_div.css"
          type="text/css">
</head>
<body style="background-color: rgb(255, 255, 255); text-align: center;">
<br>

<div class="maindefault" style="display: block;"><!--Banner insert -->
    <img src="storage/mainsite/bannerfinalfeathered.png" alt=""><a
        class="button"
        href="http://output93.rssinclude.com/output?type=iframe&amp;id=456111&amp;hash=c334e7f73918b535f66271d019d52a83"
        title="Home" target="content"><span>Home</span></a> <a class="button"
                                                               title="About Us"
                                                               href="http://mtrosecogic.org/mtrose1/about"><span>About</span></a>
    <a class="button" href="index.html" title="Mt. Rose Public Calendar"><span>Calendar</span></a>
    <a class="button" href="/flash_newpage.html" title="Live Video Feed"><span>Live
Feed</span></a> <a class="button" target="content" href="access.html"
                   title="Restricted"><span>Access</span></a>
    <a class="button" href="index.html"
       title="Mt. Rose Virtual Learning Environment"><span>Education</span></a>
    <a class="button" href="/flash_newpage.html"
       title="City of Refuge Online Webstore!"><span>Store</span></a>
    <a class="button" target="content" href="/interactive.html"
       title="Interactive Media Gallery"><span><font face="Juice">Interactive</font></span></a>
</div>
<br>

<div class="maindefault">
    <iframe
        style="margin-top: 0px; margin-bottom: 0px; text-align: center; width: 416px; height: 800px; float: left;"
        float="" marginheight="0" src="flash_newpage.html" id="flashframe"
        name="flashframe" marginwidth="0" frameborder="0" scrolling="no"></iframe>
    <iframe
        style="overflow: auto; margin-top: 6em; margin-bottom: 0px; height: 600px; width: 400px; float: right; text-align: center;"
        id="content" marginheight="0" marginwidth="0"
        src="http://output93.rssinclude.com/output?type=iframe&amp;id=456111&amp;hash=c334e7f73918b535f66271d019d52a83"
        name="content" frameborder="0"></iframe>
</div>
</body>
</html>

これがdivのCSSです（リンクされたスタイルシートです）：

.maindefault {
    margin: 0px auto;
    width: 817px;
    font-family: "High Tower Text",Georgia,Serif;
    display: inline-block;
    text-align: center;
}

また、それが役立つ場合は、Kompozer8.3を使用しています。ありがとうございました

編集::私はJSFiddlerに精通していませんが、リンクはmtrosemedia.tkです。.maindefault div最後のDIVの下に別のDIVを追加する</div>と、新しいDIVが2番目のDIVの上部にぴったりと収まります。新しいDIVを2番目のDIVの下部にぴったりと合わせる必要があります。次に、コンテンツを追加すると、フラッシュとRSSフィードの上にコンテンツが表示されます。フィードリストも改善したいのですが、別の質問をします。

4

1 に答える 1

0

コンテンツを中に入れるとdivが重なると言っていますか？

.maindefault を左に浮かせてみてください。コンテンツが追加されると、次の div は、その上の div の上部に合わせてぴったりと整列する必要があります。

于 2012-04-19T01:55:02.017 に答える