오른쪽 박스의 높이만큼 왼쪽 박스의 높이가 같아지려면..
본문
http://supia.autoapp.kr/sub01/sub01_0101.php
여기처럼..
하나의 contentarea라는 div안에
left라는 div와 content라는 div가 float으로 나열되어있습니다
<div id="contentarea">
<div class="left"></div>
<div class="content"></div>
</div>
그런데 left div에 백그라운드 색을 오른쪽 content div의 높이까지 줘야하는데
content div의 높이가 가변적이라 높이를 지정해줄수가 없거든요..
제이쿼리로
var left = $("#contentarea").height();
$(".left").css('height',left);
을 주면 될줄 알았는데 이게 잘 안되네요.
혹시 오른쪽 박스의 높이만큼 왼쪽 박스의 높이도 같아지려면 어떻게 해아하는지 아시는분? ㅠ ㅠ
답변 1
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var left = $("#contentarea").height();
$("#left").height(left);
});
</script>
<div id="contentarea" style="width:990px; margin:0 auto; overflow:hidden; border:1px solid #ddd;">
<div id="left" style="float:left; width:200px; border:1px solid #ccc;">left<br><br></div>
<div id="content" style="float:right; width:500px; border:1px solid #ccc;">right<br><br><br><br>adadfright<br><br><br><br>adadf<br></div>
</div>
파이어폭스에서만 테스트해봤습니다.
<script type="text/javascript">
$(document).ready(function(){
var left = $("#contentarea").height();
$("#left").height(left);
});
</script>
<div id="contentarea" style="width:990px; margin:0 auto; overflow:hidden; border:1px solid #ddd;">
<div id="left" style="float:left; width:200px; border:1px solid #ccc;">left<br><br></div>
<div id="content" style="float:right; width:500px; border:1px solid #ccc;">right<br><br><br><br>adadfright<br><br><br><br>adadf<br></div>
</div>
파이어폭스에서만 테스트해봤습니다.
답변을 작성하시기 전에 로그인 해주세요.