왜 '높이: 100%;'가 라벨 요소에서 작동하지 않나요?

레이블의 높이 설정: 100%가 작동하지 않음

레이블 요소의 높이를 상위 요소와 정렬하려는 시도에서, 높이: 100%; 구현되었습니다. 그러나 의도한 효과가 나타나지 않아 라벨의 높이를 임의로 남겨두었습니다.

문제 이해

높이를 100%;로 설정할 때 고려해야 할 사항 기준점. 이 경우 크기 조정 컨텍스트를 설정하려면 부모 요소의 높이를 명시적으로 정의해야 합니다. 이 컨텍스트가 없으면 브라우저는 높이의 100%를 계산할 수 있는 근거가 없습니다.

해결 방법

이 문제를 해결하려면 레이블의 상위 요소가 다음과 같은지 확인하세요. 지정된 높이. 이는 CSS를 통해 또는 HTML 마크업에서 높이 속성을 설정하여 달성할 수 있습니다.

예제 코드

<code class="css">.parent-element {
  height: 200px;
}

.field label {
  height: 100%;
}</code>

상위 요소의 높이를 200px로 설정 , 이제 라벨 요소가 사용 가능한 수직 공간의 100%를 올바르게 차지합니다.

위 내용은 왜 '높이: 100%;'가 라벨 요소에서 작동하지 않나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!