728x90
반응형
질문 : CSS-float 자식 DIV 높이를 부모 높이로 확장
페이지 구조는 다음과 같습니다.
<div class="parent">
<div class="child-left floatLeft">
</div>
<div class="child-right floatLeft">
</div>
</div>
이제 child-left
DIV에는 더 많은 콘텐츠가 있으므로 parent
DIV의 높이는 자식 DIV에 따라 증가합니다.
그러나 문제는 child-right
키가 증가하지 않는다는 것입니다. 높이를 부모와 같게 만들려면 어떻게해야합니까?
답변
parent
요소의 경우 다음 속성을 추가합니다.
.parent {
overflow: hidden;
position: relative;
width: 100%;
}
.child-right
다음과 같습니다.
.child-right {
background:green;
height: 100%;
width: 50%;
position: absolute;
right: 0;
top: 0;
}
여기에서 CSS 예제와 함께 더 자세한 결과를 확인하고 여기에서 동일한 높이 열에 대한 자세한 정보를 확인 하세요 .
출처 : https://stackoverflow.com/questions/4804581/css-expand-float-child-div-height-to-parents-height
728x90
반응형
'프로그래밍 언어 > HTML,CSS,JS' 카테고리의 다른 글
검색 엔진이 AngularJS 애플리케이션을 처리하는 방식 (0) | 2021.08.30 |
---|---|
JavaScript의 연산자 !! (NOT) (0) | 2021.08.28 |
table 셀의 CSS 텍스트가 길면 줄임표로 생략하는 방법 (0) | 2021.08.28 |
AngularJS를 사용하여 브라우저 콘솔에서 $ scope 변수에 액세스 하는 방법 (0) | 2021.08.28 |
SCSS 파일에서 일반 CSS 파일 가져오기 (0) | 2021.08.27 |