2009-11-11 3 views
0

이것은 현재 HTML 구조입니다. 바닥 글 div는 혼자 몸에 앉아 있습니다. 내가 지금까지 폭 무엇 배경색 설정을 할 수 있도록 컨테이너의 폭을 확장 할CSS의 컨테이너를 확장하려면 div가 필요합니다.

#footer 
    { 
    position: relative; 
    background: url('../footer-bg-repeat.jpg') repeat-x; 
    height: 307px; 
    } 

    #footer #footer-bg 
    { 
    background: url('../footer.jpg') no-repeat top left; 
    height: 528px; 
    width: 1587px; 
    position: absolute; 
    left: -380px; 
    top: -221px; 
    } 

    #footer .footer1 
    { 
    position: absolute; 
    top: 137px; 
    } 

    #footer .footer1 .p1 
    { 
    position: absolute; 
    left: 500px; 
    background: #dcdcdc; 
    height: 23px; 
    width: 80px; 
    text-align: center; 
    line-height: 25px; 
    font-weight: bold; 
    } 

    #footer .footer1 .p2 
    { 
    position: absolute; 
    left: 1000px; 
    top: -20px; 
    background: url() no-repeat top right; 
    height: 40px; 
    width: 249px; 
    text-indent: -9999px; 
    z-index: 6; 
    } 

    #footer .footer2 
    { 
    position: absolute; 
    top: 159px; 
    height: 23px; 
    width: 100%; 
    background: #000; 
    } 

    #footer .footer2 p 
    { 
    display: inline; 
    line-height: 25px; 
    color: #636466; 
    height: 23px; 
    } 

    #footer .footer2 .p1 
    { 
    position: absolute; 
    left: 500px; 
    background: url() no-repeat center right; 
    width: 175px; 
    } 

    #footer .footer2 .p2 
    { 
    position: absolute; 
    left: 700px; 
    background: #dcdcdc url() no-repeat 60px 8px; 
    width: 75px; 
    padding-left: 15px; 
    } 

    #footer .footer2 .p3 
    { 
    position: absolute; 
    left: 800px; 
    } 

    #footer .footer3 
    { 
    position: absolute; 
    top: 190px; 
    } 

    #footer .footer3 .p1 
    { 
    position: absolute; 
    left: 500px; 
    width: 1000px; 
    } 
내가 .footer2 얻으려고

및 .footer3 : 여기

<div id="footer"> 
    <div class="container"> 
     <div id="footer-bg"> 
      <div class="footer1"> 
       <p class="p1">asd</p> 
       <p class="p2">asd</p> 
      </div> 

      <div class="footer2"> 
       <p class="p1">asd</p> 
       <p class="p2">asd</p> 
       <p class="p3">asd</p> 
      </div> 

      <div class="footer3"> 
       <p class="p1">asd</p> 
      </div> 
     </div> 
    </div> 
    </div> 

는 그것을위한 CSS의 화면이있을 수 있습니다.

너비를 100 %로 설정하면 컨테이너 크기가됩니다. 예상대로입니다. 어떻게하면 페이지 너비에 맞출 수 있습니까?

답변

1

left 및 right 속성을 모두 0으로 설정해보십시오.

+0

시도했으나 작동하지 않았습니다. # footer-bg는 절대 위치이고 .footer [1 | 2]의 부모이므로 왼쪽과 오른쪽은 div와 관련됩니다. . 컨테이너와 동일합니다. – zilla

0

질문을 잘 정의하지 않았습니다.

당신이 중간 세트 마진을 설정하려면

margin:0 10px; 
width:%your pages width%; 

파이어 폭스에 대한 뭔가 다른 다운로드 파이어 버그 플러그인을 의미하고 당신이 구조에서 살펴 봐야 할 것했던 페이지의 바닥 글을 검사 경우 CSS 규칙. 항상 작동합니다.

관련 문제