만들기 사업부는 그것의 높이가 여기에 부모

의 내 HTML의 구조 설정 때, 컨테이너의 사업부 100 % :만들기 사업부는 그것의 높이가 여기에 부모

<li> 
    <div class='wrapper'> 
      <div class='controller'> ... </div> 
      <div class='preview'> ... </div> 
    </div> 
</li>

'미리보기'div가 다를 수있는 '컨트롤러'과의 내용, 따라서 콘텐츠의 높이도 가능합니다. '컨트롤러'와 '미리보기'div의 높이 사이에는 상관 관계가 필요하지 않습니다. 주어진 래퍼에서 하나는 10px이고 다른 하나는 100px입니다. 더 작은 하나의 높이와 일치시키기 위해 더 작은 하나를 확장하고 싶습니다. CSS 규칙 "height : 100 %;"사용 명시 적 높이가 래퍼로 설정되어 있지 않으므로 작동하지 않습니다. 래퍼의 높이가 다를 수 있으므로 래퍼의 높이를 설정할 수 없습니다.

나는 자바 스크립트가 아닌 해결책을 찾고있다. 우리 회사는 자바 스크립트가 활성화되지 않은 브라우저에 대해 엄격한 정책을 작성하고 있습니다.

출처

2012-04-11 aamiri

div에 100 % 높이를 사용하면 div 요구 사항의 내용만큼만 사용하게됩니다. 명시 적으로 높이를 설정하려면 이 있어야합니다.

당신은 어떤 자바 스크립트를 사용하여이 작업을 수행 할 수 있습니다

그것은 스크립트로 설정 될 수있다 또는 당신이 JS를 사용하지 않을 때 당신은 가짜 열 기술을 사용할 수

var height = document.getElementById('parentDiv').style.height; 
document.getElementById('childDiv').style.height = height +'px';

출처

2012-04-11 14:02:54 Gabe

정말 자바 스크립트 솔루션을 원하지 않았지만 이것이 내가 할 수있는 유일한 방법 인 것처럼 보입니다. :-( – aamiri

그래, 내가 이해하지만 블록 불량과 함께 CSS에서 일부 연결이 끊어졌다. – Gabe

http://www.alistapart.com/articles/fauxcolumns/을

출처

2012-04-11 14:04:30 markvandencorput

두 div가 서로 옆에 있다고 가정하면 (float 등을 사용하여), 이것은 여전히 원시 솔루션이없는 HTML의 매우 일반적인 문제입니다.

이 문제를 해결하는 한 가지 방법은 가짜 열이지만 제한이 있습니다. 일반적으로 아주 넓은 테두리는 작은 div의 배경색을 위조하는 데 사용되므로 단색 만 사용할 수 있습니다.

높이가 동일해야하는 경우 (두 div, 배경 이미지 또는 두 div의 하단에 위치해야하는 div 내의 동일한 위치에 동일한 테두리를 사용하는 이유 때문에) 자바 스크립트 솔루션을 사용해야합니다.

출처

2012-04-11 14:08:22

만들기 사업부는 그것의 높이가 여기에 부모

답변

관련 문제