문제

예를 들어이 페이지를 가져 가면 MyDiv의 높이가 500px 이상으로 자라도록 자녀를 MyDiv에 삽입 할 수 있습니까?


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
    <div id="mydiv" style="width:500px;height:500px;border:4px solid red">
        <!-- place content here -->
    </div>
</body>
</html>


나는 할 것이 아무것도 찾을 수 없다. 예를 들어, 아래 의이 상황은 Innerdiv의 높이가 100%라고 말했습니다. 그것은 부모의 키가 500px이고 키가 500px라는 것을 알게 될 것입니다. 순 결과는 컨텐츠의 키가 800px이며, 콘텐츠는 MyDiv를 넘어서 쏟아져 나오며 MyDiv는 여전히 500px 높이입니다.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
    <div id="mydiv" style="width:500px;height:500px;border:4px solid red">
        <img src="myimage.jpg" width="400" height="300" />
        <div style="width:100%;height:100%;background:yellow">
            hi
        </div>
    </div>
</body>
</html>

즉, Quirks 모드에서 달리는 것은 MyDIV가 자라게하여 많은 상황에서 어린이를 수용 할 수 있습니다. 표준 모드는 명시 적으로 성장하지 않는 것 같습니다. 항상 그렇습니까?

나는 이것을 Windows에서 IE8과 FF3.5에서 주로 테스트하고 있으며, IE8은 가능한 모든 모드로 실행됩니다.

도움이 되었습니까?

해결책

아니오 : 표준 모드에서는 기본값입니다 overflow 컨테이너의 속성을 설정해야합니다 visible 의미가 넘치는 콘텐츠는 컨테이너의 클리핑 영역 밖에서 렌더링됩니다. 그런 사람이 없습니다 overflow 아이들과 일치하도록 컨테이너의 크기를 키우는 옵션. 오버플로에서 더 많은 것을 볼 수 있습니다 여기

그러나 어린이의 크기에 맞게 컨테이너를 재배하는 방법이 있습니다. 표준 모드에서 올바른 방법은 CSS 속성을 설정하는 것입니다. min-height 재산 대신 height.

이후 높이 시행 행동은 IE6에서 발생하지 않으며, 사람들은 보통 두 가지를 설정하게됩니다. min-height 표준 호환 브라우저의 경우, 어느 쪽이든 설정합니다 height IE만으로 조건부 의견 또는 밑줄로 속성 이름을 접두사로 만들어 _ 따라서 IE6은 사용하지만 다른 브라우저는이를 무시합니다.

그래서 당신의 div는 같은 것입니다

<div id="mydiv" style="width:500px;min-height:500px;_height:500px;border:4px solid red">

더 많은 정보를 찾을 수 있습니다 min-height 여기 그리고 빠른 Google/Bing 검색 min-height IE6 필요한 모든 답변을 줄 것입니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top