css border-radius가 적용되지 않습니다.

CSS 경계선 반경이 탐색 래퍼에 적용되지 않습니다. 어떤 아이디어?css border-radius가 적용되지 않습니다.

코드 :

HTML :

<div class="navigation"> 
    <div><a href="">Home</a></div> 
    <div><a href="">Products</a></div> 
    <div><a href="">Services</a></div> 
    <div><a href="">Support</a></div> 
    <div><a href="">Contact</a></div> 
</div> 
<div style="clear:both;"></div>

CSS :

.navigation { 
    position:relative; 
    float:left; 

    overflow:auto; 

    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
} 

.navigation div { 
    position:relative; 
    float:left; 

    background: #484745; 

    height:53px; 
    line-height: 53px; 
}

출처

2012-07-31 Lost in OWL

어떤 브라우저로 테스트하고 있습니까? –

예. 적용되었습니다. 둥근 모서리가있는 요소에 테두리 나 배경이 없기 때문에 표시되지 않습니다. 모서리를 둥글게하고 싶은 요소를 확인하십시오. – feeela

background-color 0에주세요. 다음과 같이 쓰기 :

.navigation {  
    background: #484745; 
}

확인이 : jsFiddle

출처

2012-07-31 11:18:03 sandeep

Ahhhh 감사합니다, 나는 테두리가 실제로 요소 자체에 적용되지만 자식 요소에는 적용되지 않는다는 것을 알지 못했습니다 ... –

에 문제가 배경입니다. div의 배경 숨기기 경계선 반경은 .navigation입니다. .navigation에 배경을 추가하십시오 (http://jsfiddle.net/nDEmS/18/ 참조)

출처

2012-07-31 11:27:18

css border-radius가 적용되지 않습니다.

답변

관련 문제