CSS 바닥 글 및 배경

Question

저는 최근 웹 사이트에서 일해 왔으며 중요한 문제 (http : //jimbob.webatu.com/index.html)를 보았습니다 (웹 페이지에서 코딩해야합니다) .I've이 두 가지 열입니다하지만 middle.The 아이디 랩에 중심되도록까지 내 웹 사이트를 설정 한 모든 것을 함께 센터 무엇이며,이 열은 왼쪽 또는 오른쪽 플로트 :

 #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를 모두 피하기 위해 노력했습니다. 그러나 뭔가 잘못되어 div가 "wrap"및 "secondborder" 완전히 닫히지 않을 것이다. 또한 회색 막대가 뒤에 나타나고 "포장"배경이 적용되지 않습니다 (나는 "포장"배경이 적용되도록 사이드 바 배경을 아무 것도 설정하지 않았습니다.) 이것은 조금 더 깔끔하게 보이게합니다) . 너무 흩어져서 너무 길기 때문에 필요한 코딩을 붙여 넣을 수 없습니다 (웹 페이지의 페이지 소스를보십시오). 누군가 "랩"배경과 "바닥 글"을 센터링하지 않는 솔루션을 제공 할 수 있습니까? 지난 3 개월 동안 html 및 코딩을 배우는 중 이었으므로 내가 만든 어리석은 실수라면 용서해주십시오. 문제가있는 내 웹 사이트의 링크 : http://jimbob.webatu.com/index.html

Answer 1

오버플로 추가 : 숨김; 당신이 당신의 #sidebar에서 그것을 받아 #sidebar에 대한 폐쇄 후 배치해야합니다 귀하의 #footer이 페이지의 하단에 바닥 글처럼 행동하기 위해서는 이러한

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

같은 #wrap에 . 이렇게하면 문제가 해결됩니다.

는 #sidebar가

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

는 희망이 도움이, 당신은 SUC으로 오른쪽으로 반대가 왼쪽으로 떠 필요가 차단되고 해결하려면.

Answer 2

일반적으로 부동 div 님의 정보를 삭제해야합니다. 이것은 다음 요소에 대해 부동을 중지하도록 브라우저에 지시합니다. <div style="clear:both"></div> 문제를 분류 : 당신이 #wrap 다른 <br style="clear:both" />

Answer 3

난 그냥 당신의 secondborder 요소에 새로운 사업부를 추가 추가 닫기 전에 당신의 HTML을 보면 나는 또한 <div id="footer"><br style="clear:both" />

전에 추가 할 것입니다. 당신은 뜨고 있었고 사이드 바 또는 메인 div를 지우지 않았습니다.