스타일웹 키트 용 모서리

내가하려는 것은 "border-radius"를 사용하여 <select>의 모서리를 둥글게하는 것입니다. 이상하게도 웹킷 브라우저는 <select>의 흰색 배경 넘치는 테두리를 보여줍니다.스타일웹 키트 용 모서리

업데이트 다음 스크린 샷과 내 코드는 다음과 같습니다

enter image description here

HTML :

<select class="rounded_select"> 
    <option>rounded_select</option> 
</select>

CSS :

.rounded_select { 
    border-top: 2px solid #ccc; 
    border-left: 2px solid #ccc; 
    border-bottom: 2px solid #eee; 
    border-right: 2px solid #eee; 
    border-radius: 10px; 
}

그것을 해결하는 방법에 어떤 아이디어가 있습니까 ?

업데이트 : 선택의 오른쪽에 단추 이미지를 저장하는 것이 바람직합니다.

출처

2012-04-12 Natalia

더 나은 이해를 위해 몇 가지 코드를 보여주십시오. – sandeep

-webkit-appearance:none 트릭을 수행 할 수 있습니다.

편집 : 그래 그것을 할 나타납니다 http://jsfiddle.net/dbxjB/

출처

2012-04-12 09:07:02 keegan3d

'-webkit-appearance : none'은 오버 플로우를 제거하는 데 도움이되지만 선택의 오른쪽에있는 버튼 이미지를 자릅니다. 내 질문에이 사실을 언급하지 않아서 미안해. – Natalia

다른 브라우저에서 원하는 것을보고 계십니까? 최종 결과가 당신이 원하는 것이 무엇인지 확실하지 않습니다. 이 방법을 사용하면 단추 이미지가 제거되지만 직접 추가 할 수도 있습니다. http://37signals.com/svn/posts/2609-customizing-web-forms-with-css3-and-webkit – keegan3d

감사합니다. 링크. – Natalia

select에 대한 background-color 설정 트릭을 할 것으로 보인다.

편집 :하지 않습니다. 국경을 1px로 설정하면됩니다. 2px뿐만 아니라 예를 들어 파선. 글리치.

출처

2012-04-12 09:10:50

스타일웹 키트 용 모서리

답변

관련 문제