테스트 사이트 - 개발 중인 베타 버전입니다

높이 100% 반응형 div 조언좀 부탁드립니다. 채택완료

헐크매니아 8년 전 조회 3,744

 

그림처럼 div가 3개가 있고 그림에는 없지만 3개를 묶는 상위 div가 있는 형태입니다.

그림을 잘못그렸는데 2번과 3번은 안에 내용들어가는대로 높이가 늘어나도록 할 생각이라

상관없고 1번이 문제인데 1번은 언제나 100%의 높이를 유지하게 만들고 싶네요.

2번에 메인 내용이 들어갈건데 2번이 내용이 길어지면 똑같이 1번도 그에 맞춰서

높이가 늘어나도록요. 어떻게 해야될까요?

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트

테이블 코딩하시면 간단하게 처리될거 같습니다.

 

</p><p><style></p><p>.auto_height_table{</p><p><span class="Apple-tab-span" style="white-space:pre">	</span>width: 100%;</p><p>}</p><p>.auto_height_table tr td{</p><p><span class="Apple-tab-span" style="white-space:pre">	</span>width: 33%;</p><p><span class="Apple-tab-span" style="white-space:pre">	</span>text-align: center;</p><p><span class="Apple-tab-span" style="white-space:pre">	</span>color: #fff;</p><p>}</p><p> </p><p></style></p><p> </p><p><table class="auto_height_table"></p><p><tr></p><p><td class="red_bg" style="background-color: #ff0000;">1</td></p><p><td class="blue_bg" style="background-color: #00ff00;">2
2
3</td></p><p><td class="green_bg" style="background-color: #0000ff;">3</td></p><p></tr></p><p></table></p><p>

 

내용을 위로 정렬 시키고 싶으면

.red_bg{

vertical-align : top;

}

하시면 위로 정렬 됩니당.

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

헐크매니아
8년 전
근데 궁금한게 높이면 height를 변경해야되는거 아닌가요? width로 하는 이유가?
쌔깜디블랙죠
8년 전
높이는 어차피 컨텐츠가 채워진만큼 높아질테니 조절할 필요가 없지요~

댓글을 작성하려면 로그인이 필요합니다.

진서기
8년 전
로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인