CSS 스팬 요소의 테두리가 전체 높이가 아님

Question

내 별 등급 막대의 구분선을 만들려고합니다. 분리 기호 테두리를 가져 오는 데 문제가 있습니다. 전체 높이로 이동했습니다. 내가 놓친 게 있니?

JSBIN : http://jsbin.com/fusor/1/edit

Answer 1

시도 .rating{display:block}

을 제공해야합니다.

.answer { 
    width: 135px; 
    border-radius: 5px 5px 5px 5px; 
    box-shadow: 0 0 5px rgb(200, 200, 200); 
    background: rgb(229, 229, 229); 
    margin-left: auto; 
    margin-right: auto; 
    height: 24px; 
} 

Answer 2

내가 내 .answer 컨테이너에서 높이 속성을 누락되었습니다. .rating-star와 일치하도록 변경하면 내 문제가 해결됩니다.

Answer 3

는이 예를 참조하여 문제를 해결해야 .answer 클래스에 높이를 추가 labs.codeteam.in/lab/!C36Si!pX7i9Lp5cFplpjCSiaBWBcXNv