阻止DIV與其他DIV重疊（CSS）

我只需要3個DIV在彼此之上。這不是很多的代碼，當我沒有任何內容的時候，它可以正確堆疊。不知道我在做什麼錯，但是這裏有代碼。我想在中間內容DIV下面再添加一個DIV。這用於底部信息欄。我知道z-index更多地用於圖層，並不會對我的知識有利。阻止DIV與其他DIV重疊（CSS）

這裏是我的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; 
}

而且，我使用KompoZer會8.3是否有幫助。 ThankYOU

編輯::我不熟悉JS提琴手，但鏈接是mtrosemedia.tk。當我在最後的</div>下添加另一個.maindefault div時，我的新DIV會緊貼第二個DIV的頂部。我需要新的DIV緊貼第二個DIV的底部。然後，當我添加內容時，它會顯示在我的Flash和我的RSS提要上。我還想改進Feed列表，但我會提出另一個問題。

來源

2012-04-19 newburns

這將有助於如果您發佈鏈接到工作網站或jsFiddle示例。 – 2012-04-19 20:15:57

當你把內容放進去時，你是說divs重疊嗎？

嘗試將.maindefault左移。添加內容時，下一個div應該對齊好，並緊貼上面的頂部。

來源

2012-04-19 01:55:02 Tama198

編輯::我不熟悉JS提琴手，但鏈接是mtrosemedia.tk。發生什麼事的是，當我在最後添加另一個.maindefault div時，我的新DIV緊挨着第二個DIV的頂部。我需要新的DIV緊貼第二個DIV的底部。然後，當我添加內容時，它會顯示在我的Flash和我的RSS提要上。我還想改進Feed列表，但我會提出另一個問題。 – newburns 2012-04-21 12:58:12

阻止DIV與其他DIV重疊（CSS）

回答

相關問題