확대/축소시 단추 텍스트 모양 유지

사용자가 확대하거나 축소 할 때 어떻게 단추 모양을 유지할 수 있습니까? 텍스트와 버튼의 가장자리 사이의 간격은 일정하게 유지되어야합니다. 바이올린에확대/축소시 단추 텍스트 모양 유지

jsfiddle of this question

작품은 여기에 묘사 : http://jsfiddle.net/DevinRhode2/B4Usb/5/ 100 %로 브라우저 줌을 설정하고 바이올린에서 zoom: 1.1;를 제거하면

, 당신은 버튼을 볼 수 완전히 포함 된 텍스트를 중심으로 -이 보기가 목표입니다.

필요한 수정 사항을 사용하여 Mac 기본 버튼의 CSS를 다시 만드는 것이 더 쉽습니다.

동일한 OS X 스타일을 수정하거나 수정하는 것은 쉽지 않을 것이므로 나는 현상금을 시작했다.

저는 크롬, 파이어 폭스 및 IE에서 싫증났습니다. 모든 것이 올바르게 확대되고 버튼 경계를 벗어나는 텍스트는 볼 수 없습니다. http://i.imgur.com/q3mZ7.png

2012-12-06 08:16:25 Astro

음, 버튼의 중앙에 텍스트 숙박을합니까? 해결책이 있다면 jsfiddle 링크를 공유하십시오. 위의 jsfiddle의 포크를 사용하는 것이 좋습니다. –

그 점은 내가 변경하지 않은 점입니다. 다른 브라우저에서 확대하는 동안 코드가 올바르게 작동했습니다. 이전 답장에 스크린 샷 링크가 있습니다. 어떤 OS와 브라우저로 작업하고 있습니까? – Astro

충분히 가까이에서 보면 중심에 있지 않습니다. 나는 여기에 확대/축소를 과장 : http://jsfiddle.net/DevinRhode2/B4Usb/5/ Windows 또는 Mac, 그리고 어떤 버전에 있습니까? –

사실 OSX의 Chrome에서 OSX 사용에 문제가있었습니다. 이는 OSX의 버튼에 대한 기본 스타일링 규칙 때문에 발생합니다.

당신은 버튼에 자신의 배경 스타일을 추가하여 문제를 해결할 수 있습니다 : 스타일 버튼의 기본 테두리 uuugly 같이

#fixed { 
    background: #eee; 
    border: 0; 
}

나는 또한 국경을 제거했습니다. 줌을 거기없는 것처럼

2012-12-06 08:53:36 Kyle

답변