Firefox에서 과도한 버튼 간격을 어떻게 수정합니까?

Firefox에서 버튼 간격 수정

Firefox에서 버튼은 다른 브라우저에 비해 패딩과 간격이 더 많은 경향이 있습니다. 이는 특히 다양한 브라우저에서 일관된 디자인을 유지할 때 외관상 방해가 될 수 있습니다.

이 공백을 제거하려면 다음 CSS를 추가하세요.

button::-moz-focus-inner {
    padding: 0;
    border: 0
}

이 규칙은 '내부 초점'을 대상으로 합니다. Firefox에만 해당되는 의사 요소입니다. 패딩 및 테두리 속성을 0으로 설정하면 추가 간격이 제거됩니다.

또한 규칙에 테두리 속성을 포함하는 것이 좋습니다. 패딩을 0으로 설정하면 Firefox에서 버튼이 포커스를 받을 때 버튼 주위에 나타나는 점선 윤곽선이 제거되기 때문입니다. 일부 개발자는 이 윤곽선을 완전히 제거하기로 선택하고 다른 개발자는 시각적으로 더 매력적인 요소로 대체합니다.

이 CSS를 사용하면 버튼은 Firefox와 다른 브라우저 모두에서 일관된 간격과 모양을 갖게 됩니다. 시각적 비교를 위해 아래의 업데이트된 JSFiddle 예제를 참조하세요.

[업데이트된 JSFiddle](http://jsfiddle.net/thirtydot/Z2BMK/1/)

위 내용은 Firefox에서 과도한 버튼 간격을 어떻게 수정합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!