정렬되지 않은 목록의 테두리가 div의 전체 너비에 맞지 않습니다.

각 li 아래에 테두리가있는 정렬되지 않은 블록 목록 (div 안에 있음)을 만들고 있습니다. 하지만 어떻게 든 테두리는 div의 전체 너비에 맞지 않습니다. 나는 이것을하기 위해서 ul이 div에 정확하게 들어 맞아야한다고 생각하지만, 어떻게해야할지 모르겠다.정렬되지 않은 목록의 테두리가 div의 전체 너비에 맞지 않습니다.

이 거기에 화면 사업부의 샷과 UL이다

list in the div

는 그리고 이것은 내가 사용하는 CSS 코드 :

.stats-list li{ 
    zoom: 1; 
    border-bottom:1px solid #ececec; 
    border-spacing:30px; 
    display:block; 
    text-align:left; 
    margin-bottom:20px; 
    color:#ffffff; 
    height:40px; 
} 
.stats-list ul{ 
    list-style-type:none; 

}

내가 건너 온 적이 없어요 이 문제는 전에. 누구든지 해결책이 있습니까? 감사.

UPDATE (HTML 코드) :

<div class="checkin-stats-right"> 
     <ul class="stats-list"> 
      <li>bla blaaa</li> 
      <li>blaaaa</li>  
      <li>blaaaaaa</li> 
     </ul> 

</div>

또 다른 업데이트 (부모 DIV의 CSS 코드) : 기본적으로

.checkin-stats-right{ 
    background-color: #cfcfcf; 
    width: 320px; 
    height: 180px; 
    margin-right: auto; 
    float:left; 
    margin-left:25px; 
    margin-top:25px; 

}

출처

2012-01-14 Loolooii

는 UL 요소는 일반적으로 일정 금액에 padding-left 세트가 픽셀 수 이 시도 :

<!DOCTYPE html> 
<html> 
    <head> 
     <title></title> 
     <style> 
      .stats-list li { 
       zoom: 1; 
       border-bottom:1px solid #ececec; 
       border-spacing:30px; 
       display:block; 
       text-align:left; 
       margin-bottom:20px; 
       color:#ffffff; 
       height:40px; 
      } 

      ul.stats-list { 
       list-style-type:none; 
       padding-left: 0; 
      } 

      .checkin-stats-right { 
       background-color: #cfcfcf; 
       width: 320px; 
       height: 180px; 
       margin-right: auto; 
       float:left; 
       margin-left:25px; 
       margin-top:25px; 
      } 
     </style> 
    </head> 
    <body> 
     <div class="checkin-stats-right"> 
      <ul class="stats-list"> 
       <li>bla blaaa</li> 
       <li>blaaaa</li>  
       <li>blaaaaaa</li> 
      </ul> 

     </div> 
    </body> 
</html>

또한

출처

2012-01-14 13:59:19 fivedigit

하지만이 작동하지 않습니다 어느 한 쪽. 상위 div의 CSS 코드로 내 질문을 업데이트합니다. 아마도 도움이 될 것입니다. – Loolooii

전체 답변 코드가 업데이트되었습니다. 이것이 작동하는지 알려주세요. 귀하의 코드에는 제가 고칠 수있는 몇 가지 다른 문제가 있습니다. – fivedigit

감사합니다. 이로 인해 문제가 해결되었습니다. 문제는 ul.stats-list {} 인 통계 목록 ul {}입니다. – Loolooii

.stats-list ul { 
    padding-left: 0; 
}

주의 ".stats리스트 UL"를 일치하지 않는 HTML에서 "ul.stats 목록"그

의미가

출처

2012-01-14 14:04:24 Flo

왼쪽 패딩은 문제를 해결하지 못합니다 이 경우에. 그게 무슨 뜻인지 이해가 안되니? 나는 그것을하기 위해 무엇을해야하며, 나는 무엇을 잘못하고 있는가? 감사. – Loolooii

정렬되지 않은 목록의 테두리가 div의 전체 너비에 맞지 않습니다.

답변

관련 문제