``요소에 대해 'width: auto'가 예상대로 작동하지 않는 이유는 무엇입니까?

의 경우 너비:자동 필드

CSS에서 블록 수준 요소의 width:auto는 일반적으로 사용 가능한 공간을 채우기 위해 너비가 확장된다는 것을 의미합니다. 그러나 이 동작은 elements.

에 대해 width:auto는 무엇을 합니까?

의 기본 크기 속성입니다. 요소는 초기 너비를 결정합니다. width:auto는 단지 의 너비를 기본 크기로 설정합니다.

원하는 동작 달성

사용 가능한 너비의 100%를 차지하려면 width:auto 대신 width:100%를 사용하세요. 그러나 테두리 렌더링의 브라우저 변형으로 인해 불일치가 발생할 수 있습니다.

대체 접근 방식

에 사용 가능한 너비를 채우는 또 다른 방법은 제거하는 것입니다. 크기 속성을 지정하고 다음을 지정합니다.

<code class="css">input {
  width: 100%;
  margin: -3px;
  border: 2px inset #eee;
}</code>

이 접근 방식은 기본 너비를 제거하고 브라우저 전체에서 일관된 동작을 제공합니다. 테두리의 너비와 들여쓰기를 오프셋하기 위해 여백에서 3픽셀을 뺍니다.

위 내용은 ``요소에 대해 'width: auto'가 예상대로 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!