Css頁腳和背景

我一直在網站上最近工作，並遇到了一個主要問題：http：//jimbob.webatu.com/index.html（你需要看到網頁上的編碼） .I've建立自己的網站，因此有兩個主要列，但都集中到middle.The ID包是一起什麼都中心和兩列浮動左或右：Css頁腳和背景

 #wrap { 
    width:750px; 
    margin:0 auto; 
    background-color:#6E6E6E; 
    border-left:3px solid #A9E2F3; 
    border-right:3px solid #A9E2F3; 
    } 
    #main { 
    float:left; 
    width:496px; 
    background:white; 
    border-top-right-radius:5px 5px; 
    border-bottom-right-radius:5px 5px; 
    } 
    #sidebar { 
    float:right; 
    width:250px; 
    } `

但是最近我嘗試使用頂部的導航欄添加頁腳欄。這已被設置爲通過使用「clear：both」來保持總體變形，並且一直試圖使其完全避免「wrap」id。然而，出現了問題，並且控制「wrap」和「secondborder」不會完全關閉。同樣，你可能會看到後面出現了一個灰色條，並且「換行」背景將不適用（我已經將側欄背景設置爲空白，以便「換行」背景適用於它，這看起來有點整潔）。我無法粘貼所需的編碼，因爲它太分散且時間太長（請查看網頁上的頁面源代碼）。任何人都可以提供一個解決方案，「包裝」的背景和「footer」不居中？我只在過去的3個月裏一直在學習html和編碼，所以請原諒我，如果這是我犯的一個愚蠢的錯誤。再次鏈接到我的網站的問題是：http://jimbob.webatu.com/index.html

來源

2012-06-12 user1396017

創建一個http://jsfiddle.net/原型，所以我們可以玩你的代碼。 – pixeline

添加溢出：隱藏;您#wrap這樣

#wrap { 
    width: 750px; 
    margin: 0 auto; 
    background-color: #6E6E6E; 
    border-left: 3px solid #A9E2F3; 
    border-right: 3px solid #A9E2F3; 
    height: auto; 
    overflow: hidden; 
    }

爲了使您的#footer的要像在頁面底部的頁腳，你將不得不把它從你#sidebar的，並把它收爲#sidebar後。這應該可以解決你的問題。

要解決的#sidebar被切斷你需要浮起來離開，而不是權利，SUC，

#sidebar { 
    float: left; 
    width: 250px; 
    }

希望這有助於。

來源

2012-06-12 09:09:13 frontendzzzguy

這似乎已經固定除了導致側欄移動和切斷它的一部分。感謝您修復頁腳和灰色條，儘管 – user1396017

我更新了我的答案，以幫助您處理#sidebar問題。 – frontendzzzguy

謝謝你。這似乎修復了我無法處理的一切。 – user1396017

一般來說，你需要清除後，你的浮動div的。這告訴瀏覽器停止下一個元素的浮動。看你的HTML我以前<div id="footer"><br style="clear:both" />

同時添加，關閉#wrap再添<br style="clear:both" />

來源

2012-06-12 08:54:49 Filype

這是膨脹：只需將「overflow：hidden」添加到容納浮動元素的容器即可。 – pixeline

這似乎沒有做任何不幸的事 – user1396017

@pixeline我需要放置'overflow：hidden'嗎？它是否與「wrap」ID？ – user1396017

我只是增加了一個新的div你secondborder元素之前：<div style="clear:both"></div>是排序的問題。你是浮動的，沒有清除邊欄或主div。

來源

2012-06-12 08:57:09

我需要在第二個邊框上放置「clear：both」的div嗎？ – user1396017

Css頁腳和背景

回答

相關問題