버튼 (입력, 버튼)을 작성하면 즉, 즉 다음을 찾을 수 있습니다.
단어의 수가 증가함에 따라, 양면 사이의 간격은 점점 커집니다.
Win의 XP 스타일에서 단어 수가 많을 때 양쪽에 심각한 제기가 나타납니다.
이유는 정확히 무엇입니까?
Blue Evel의 원래 웹 표준화 열은 다음과 같이 답변합니다.
1. IE가 버튼 값을 4 바이트 (2 중 한자) 씩 추가 할 때마다 버튼의 양쪽에 총 1 바이트의 마진 너비가 생성됩니다.
2. IE 버튼 (XP 스타일)의 기본 스타일은 배경으로 고정 된 크기의 둥근 사각형 사진이므로 버튼이 더 넓고 키가 커지면이 고정 된 크기의 둥근 사각형 사진의 가장자리가 자연스럽게 서리가 뿌려집니다.
WIN 시스템이 버그 자체를 수정하지 않으면 당분간 두 번째 문제를 해결할 수는 없지만 여전히 첫 번째 문제를 해결할 수 있습니다.
IE에서 버튼 요소에 대한 오버 플로우 속성의 가시 값을 설정합니다 (참고 : 패딩 값은 오버플로 : 가시 속성이 설정된 후에 만 유효합니다). 이 속성은 실제로 마지막 기사 "배경 클립 및 배경 오리핀의 적용"에 사용되었습니다. 그러나 오늘 "IE의 스트레치 버튼 문제"를 읽은 후 작은 버그가 있음을 알았습니다. 버튼을 테이블 셀에 배치하면 버튼이 올바르게 표시되지만 원래 예약 너비가 변경되지 않고 여전히 공간을 차지했습니다. IE6에서 버튼의 너비를 0으로 설정해야합니다 (IE7에는이 버그가 있지만 당분간 해결할 수있는 좋은 방법은 없습니다).
최종 수정 코드는 다음과 같습니다 (데모) :
입력 .Button {패딩 : 0 .25EM; 너비 : 자동; _width : 0; 오버플로 : 가시! IE;}