2011-10-12 3 views
2

두 개의 그림이 있습니다. 첫 번째는 크롬입니다. Beğen과 Yorumlar 버튼이 오른쪽에 있습니다. 경계선이 매우 잘 보입니다. ..div 테두리 반경 문제 (파이어 폭스와 오페라에서)

두 번째 그림은 그 점을 보여줍니다. 파이어 폭스와 오페라 국경 radius.I과 국경 - witdh : 얇은 경계 : 1px 고체 등 문제가있다.하지만 그 모양이 같아.

어떻게 처리 할 수 ​​있습니까? 너는 어떤 생각을 가지고 있니? 내 english.Thank 죄송

당신

image on chrome

image on ff and opera

+2

어떤 기회 jsfiddle.com에서 일하는 악마? 그래픽으로보기보다는 실제로 볼 수 있다면 상황을 해결하는 데 도움이 될 것입니다. – Spudley

+0

내 문제를 설명 할게 미안. 파란색 버튼을 아주 잘 보았어. 국경은 쓰지 않아. 국경 : 0. 나는 파이어 폭스와 오페라 경계선이 희미해진 것을 의미합니다. 국경이있는 것처럼 보여줍니다. 사실 국경이 없습니다. 나는 그림자를 드리려고하지 않습니다. 경계하고 싶지 않습니다. 배경 이미지가 있습니다. 나는 급히 보여주고 싶다. 사진을보십시오 .Firefox는 경계를 보여줍니다 .Chrome은 매우 좋습니다. 실제로 시간에 div에는 테두리가 없습니다! [사진] (https://lh5.googleusercontent.com/-ZGVCFkKiSQk/TpXUKpYll6I/AAAAAAAAAKI/SbLRzAsZCu0/s782/btn2.png) – Ayro

+0

나는 고쳤다. 프리 블렘은 배경색과 배경 이미지를 동시에 사용했다. 배경 이미지 만 사용하고 있습니다. 문제 없습니다. 감사합니다. :) – Ayro

답변

4

이 효과는 일반적으로 "배경 블리드"또는 "누출"이라고합니다. 내가 처음 마이크 하딩의 블로그에서이 알게

-moz-background-clip: padding; 
-webkit-background-clip: padding-box; 
background-clip: padding-box; 

: 그것은 몇 가지 간단한 CSS를 통해 고정 할 수 있습니다
http://tumble.sneak.co.nz/post/928998513/fixing-the-background-bleed

을 그리고 여기 W3C 사양의 다음을 제공
http://www.w3.org/TR/css3-background/#the-background-clip

0

border:1px double ...에 쵸메의 테두리 도움이됩니다. 크롬에 반경이있는 문제가 있다는 것을 알고 있습니다. 단색보다 두 배로 설정하면 약간 청소하는 데 도움이됩니다. 일종의 성가신 일.

1

... 테두리를 전혀 사용하지 않고 사라질 수있는 것처럼 보입니다. 버튼과 배경 사이에는 충분한 대비가 있습니다. 1px (흐림 반경)의 바깥 쪽 광선을 사용해 보았습니까?

-moz-box-shadow: [position-x] [position-y] [blur-radius] [color]; 
-webkit-box-shadow: [position-x] [position-y] [blur-radius] [color]; 
box-shadow: [position-x] [position-y] [blur-radius] [color]; 
관련 문제