height=100%에서 사이즈 문제

Mozilla Firefox 사용에 대한 일반적인 질문과 답을 해 주는 게시판입니다. 질문을 하기 전에 FAQ를 읽어 보시는게 도움이 될 것입니다.
Post Reply
강짱

height=100%에서 사이즈 문제

Post by 강짱 »

얼마전에 height=100%문제때문에 질문올렸었는데요
그문제 해결하고 나중에 다른 브라우저에서는 다 잘보이는데요
유독 IE6에서만 밑으로 내려가는 글씨가 서브메뉴에서
2글자가 출력이 되네요..
이게 #Content_area에서 border:1px을 주었을땐
안나오고요..확인겸 border를 자주 주거든요
http://211.239.162.97:8888/01_about/test1.jsp
테스트 사이트 인데요.
한개 해결되면 한개가 걸리고..
지금 IE6만 빼고 보고 있는데요
해결방법 좀 찾아주세요
머리가 왁왁하네요.

아 또 이건..그냥 궁금한건데요.
#Middle 에서 width=946px 로 주면
height 값이 100%로 안되더라구요
근데 #Container 값에 width=946px 을 주면 적용되고..
이게 어떻게 해서 다르게 적용 되는지 아시는분
답변 부탁드릴께요.

Code: Select all

<%@ page contentType="text/html; charset=euc-kr" language="java" import="java.sql.*, java.util.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<link href="/share/css/base.css" rel="stylesheet" type="text/css" />
<title>Untitled Document</title>
<style type="text/css">
#topMenu{
	height: 210px;
	background: #ddd;
	position: relative;
	z-index: 1;
}
#Middle {vertical-align:top;
	border:1px solid red;
	min-height:100%;
	margin: -210px 0 -86px;
	background:url(/images/common/middle_bg.gif) repeat-y;
}
* html #Middle{
	height: 100%;
}
 #Container {width:946px;padding: 209px 0px 86px;}
#Container:after {clear: both;display: block;font: 1px/0px serif;content: ".";height: 0;visibility: hidden;}

#subMenu {float:left;width:245px;padding:0;border:0px solid red;display:inline;}
#subMenu  .bg01{height:65px;background:url(/images/about/left_tit_bg.gif) no-repeat left top;margin-bottom:11px;}
#subMenu  .bg02{width:245px;height:65px;background:url/images/service/left_tit.gif) no-repeat left top;margin-bottom:11px;}
#subMenu  .bg03{width:245px;height:65px;background:url(/images/solution/left_tit.gif) no-repeat left top;margin-bottom:11px;}
#subMenu  .bg04{width:245px;height:65px;background:url/images/reference/left_tit.gif) no-repeat left top;margin-bottom:11px;}
#subMenu  .bg05{width:245px;height:65px;background:url(/images/support/left_tit.gif) no-repeat left top;margin-bottom:11px;}
#subMenu  .bg06{width:245px;height:65px;background:url(/images/recruit/left_tit.gif) no-repeat left top;margin-bottom:11px;}
#subMenu  ul{width:183px;margin-left:31px;}
#subMenu  ul li{height:29px;border-bottom:1px solid #ebebeb;display:block;}
#subMenu  .Ico_link{width:183px;height:62px;margin:80px 0 10px 31px;background:url(/images/common/ico_bg.gif) no-repeat center top;vertical-align:top;}
#subMenu  .Ico_link img{margin:0 17px;}

#Content_area{float:right;width:643px;padding:0 28px 0 30px;display:inline;vertical-align:top;background:url(/images/common/con_top_bg.gif) no-repeat top left;}

/**** Header ****/
#header{width:100%;height:65px;}
#header .location{font-family:돋움; font-size:11px; color:#999;padding-top:13px;text-align:right;}
#header .location a{text-decoration:none;}
#header .location span{font-family:돋움; font-size:11px;color:#000;}
#header h1{margin:11px 0 0 0;color:#999999;border:0px solid red;}

#Content_wrapper{vertical-align:top;margin:10px 0 10px 0;padding:0;overflow:hidden;border:1px solid red;}



#Footer_area {width:946px;height: 86px;background: #FFF;position:relative;bottom: 0 !important;bottom:-1px; /* For Certain IE widths */}

/* Btm bg 영역 */
#Btmback {height:25px;padding:0;margin:0 0 10px 0;background:url(/images/common/btmbg.gif) no-repeat top left;}
#Footer{height:51px;background:#000;width:909px;margin:0 0 0 29px;padding:0;background:url(/images/common/footer_bg.gif) repeat-x left top;}
#Footer #logo{float:left;margin:16px 0 0 29px;display:inline;}
/* float 를 쓴 객체에 margin의 left 값이나 right 값이 들어가면 float 를 쓴 객체에 margin 가로값을 주고나서는 꼭 display: inline 값 */
#Footer address{ float:left; margin:16px 0 0 42px;;padding:0;display:inline;}
#Footer #footer_link{float:right;margin:16px 36px 0 0;padding:0;display:inline;}


/** 퀵메뉴 **/
#quick {position:absolute;visibility: visible;width:52px; height:194px; left:946px; top:286px; z-index:100;}
#quick ul{width:52px;height:178px;background:url(/images/common/quick_bg.gif) no-repeat bottom right;padding:2px 0 0 0;}
#quick ul li{width:49px;height:45px;border-bottom:1px solid #d9d9d9;display:block;text-align:center;padding-top:10px;}
* html #quick ul li{height:55px; /* For IE */}

</style>
</head>

<body id="wrapper1">
<div id="topMenu"><img src="/images/about/top_visual.gif"  usemap="#visual"/></div>
<div id="Middle">
<div id="Container">
	<!-- # Left Include -->
			<%@ include file="/include/left_01.jsp" %>
<div id="Content_area">
	<div id="header">
					<div class="location">HOME > ABOUT > <span>회사개요</span></div>
					<h1><img src="/images/about/con_01_tit_01.gif" alt="회사개요" /></h1>
				</div>
<h2>Resize the window to see the footer move</h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In augue. Sed vitae urna feugiat ante faucibus scelerisque. Maecenas non risus vitae velit auctor tincidunt. Ut facilisis elit non metus. Quisque ac dolor. Morbi eget erat in eros rhoncus imperdiet. Aenean egestas lectus ac sapien. Pellentesque non metus ac justo luctus feugiat. Nam elit elit, sagittis vel, eleifend quis, imperdiet non, lorem. In hac habitasse platea dictumst. Suspendisse convallis, dui vitae auctor elementum, eros orci porta nisl, in ullamcorper leo wisi eget mi. Sed eget sem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sit amet diam at elit lacinia convallis. Nullam massa ligula, posuere sit amet, gravida a, placerat ac, justo. Cras vulputate. Aliquam sed enim non justo sollicitudin tempor.</p>
      <p>Donec consequat cursus elit. Quisque posuere, massa blandit tincidunt aliquam, ipsum lectus egestas tortor, a iaculis ipsum urna et quam. Donec ultrices varius mi. Sed non magna. Sed ligula. Etiam magna quam, viverra at, fringilla nec, nonummy ut, wisi. Aenean volutpat, tellus at faucibus bibendum, sapien massa mattis lorem, id volutpat quam odio vitae mauris. Donec laoreet lacinia urna. Integer adipiscing dui nec dui. Curabitur non nulla. Vestibulum faucibus, quam ut iaculis volutpat, nibh risus tempus risus, quis lobortis nulla erat nec ipsum. Pellentesque ac est in libero semper hendrerit. Maecenas accumsan est quis diam varius laoreet. Ut velit risus, sollicitudin in, tempor ut, gravida non, sem. Quisque at quam vel orci volutpat luctus.</p><h2>Resize the window to see the footer move</h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In augue. Sed vitae urna feugiat ante faucibus scelerisque. Maecenas non risus vitae velit auctor tincidunt. Ut facilisis elit non metus. Quisque ac dolor. Morbi eget erat in eros rhoncus imperdiet. Aenean egestas lectus ac sapien. Pellentesque non metus ac justo luctus feugiat. Nam elit elit, sagittis vel, eleifend quis, imperdiet non, lorem. In hac habitasse platea dictumst. Suspendisse convallis, dui vitae auctor elementum, eros orci porta nisl, in ullamcorper leo wisi eget mi. Sed eget sem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sit amet diam at elit lacinia convallis. Nullam massa ligula, posuere sit amet, gravida a, placerat ac, justo. Cras vulputate. Aliquam sed enim non justo sollicitudin tempor.</p>

	  <h2>Resize the window to see the footer move</h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In augue. Sed vitae urna feugiat ante faucibus scelerisque. Maecenas non risus vitae velit auctor tincidunt. Ut facilisis elit non metus. Quisque ac dolor. Morbi eget erat in eros rhoncus imperdiet. Aenean egestas lectus ac sapien. Pellentesque non metus ac justo luctus feugiat. Nam elit elit, sagittis vel, eleifend quis, imperdiet non, lorem. In hac habitasse platea dictumst. Suspendisse convallis, dui vitae auctor elementum, eros orci porta nisl, in ullamcorper leo wisi eget mi. Sed eget sem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sit amet diam at elit lacinia convallis. Nullam massa ligula, posuere sit amet, gravida a, placerat ac, justo. Cras vulputate. Aliquam sed enim non justo sollicitudin tempor.</p>
      <p>Donec consequat cursus elit. Quisque posuere, massa blandit tincidunt aliquam, ipsum lectus egestas tortor, a iaculis ipsum urna et quam. Donec ultrices varius mi. Sed non magna. Sed ligula. Etiam magna quam, viverra at, fringilla nec, nonummy ut, wisi. Aenean volutpat, tellus at faucibus bibendum, sapien massa mattis lorem, id volutpat quam odio vitae mauris. Donec laoreet lacinia urna. Integer adipiscing dui nec dui. Curabitur non nulla. Vestibulum faucibus, quam ut iaculis volutpat, nibh risus tempus risus, quis lobortis nulla erat nec ipsum. Pellentesque ac est in libero semper hendrerit. Maecenas accumsan est quis diam varius laoreet. Ut velit risus, sollicitudin in, tempor ut, gravida non, sem. Quisque at quam vel orci volutpat luctus.</p><h2>Resize the window to see the footer move</h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In augue. Sed vitae urna feugiat ante faucibus scelerisque. Maecenas non risus vitae velit auctor tincidunt. Ut facilisis elit non metus. Quisque ac dolor. Morbi eget erat in eros rhoncus imperdiet. Aenean egestas lectus ac sapien. Pellentesque non metus ac justo luctus feugiat. Nam elit elit, sagittis vel, eleifend quis, imperdiet non, lorem. In hac habitasse platea dictumst. Suspendisse convallis, dui vitae auctor elementum, eros orci porta nisl, in ullamcorper leo wisi eget mi. Sed eget sem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sit amet diam at elit lacinia convallis. Nullam massa ligula, posuere sit amet, gravida a, placerat ac, justo. Cras vulputate. Aliquam sed enim non justo sollicitudin tempor.</p>

	   <h2>Resize the window to see the footer move</h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In augue. Sed vitae urna feugiat ante faucibus scelerisque. Maecenas non risus vitae velit auctor tincidunt. Ut facilisis elit non metus. Quisque ac dolor. Morbi eget erat in eros rhoncus imperdiet. Aenean egestas lectus ac sapien. Pellentesque non metus ac justo luctus feugiat. Nam elit elit, sagittis vel, eleifend quis, imperdiet non, lorem. In hac habitasse platea dictumst. Suspendisse convallis, dui vitae auctor elementum, eros orci porta nisl, in ullamcorper leo wisi eget mi. Sed eget sem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sit amet diam at elit lacinia convallis. Nullam massa ligula, posuere sit amet, gravida a, placerat ac, justo. Cras vulputate. Aliquam sed enim non justo sollicitudin tempor.</p>
      <p>Donec consequat cursus elit. Quisque posuere, massa blandit tincidunt aliquam, ipsum lectus egestas tortor, a iaculis ipsum urna et quam. Donec ultrices varius mi. Sed non magna. Sed ligula. Etiam magna quam, viverra at, fringilla nec, nonummy ut, wisi. Aenean volutpat, tellus at faucibus bibendum, sapien massa mattis lorem, id volutpat quam odio vitae mauris. Donec laoreet lacinia urna. Integer adipiscing dui nec dui. Curabitur non nulla. Vestibulum faucibus, quam ut iaculis volutpat, nibh risus tempus risus, quis lobortis nulla erat nec ipsum. Pellentesque ac est in libero semper hendrerit. Maecenas accumsan est quis diam varius laoreet. Ut velit risus, sollicitudin in, tempor ut, gravida non, sem. Quisque at quam vel orci volutpat luctus.</p><h2>Resize the window to see the footer move</h2>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In augue. Sed vitae urna feugiat ante faucibus scelerisque. Maecenas non risus vitae velit auctor tincidunt. Ut facilisis elit non metus. Quisque ac dolor. Morbi eget erat in eros rhoncus imperdiet. Aenean egestas lectus ac sapien. Pellentesque non metus ac justo luctus feugiat. Nam elit elit, sagittis vel, eleifend quis, imperdiet non, lorem. In hac habitasse platea dictumst. Suspendisse convallis, dui vitae auctor elementum, eros orci porta nisl, in ullamcorper leo wisi eget mi. Sed eget sem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sit amet diam at elit lacinia convallis. Nullam massa ligula, posuere sit amet, gravida a, placerat ac, justo. Cras vulputate. Aliquam sed enim non justo sollicitudin tempor.</p>


	  <br />
      1234
</div>
</div>
</div>
 <!-- #Footer -->
<%@ include file="/include/sub_footer.jsp" %>
<!--//Footer End-->


강짱

Re: height=100%에서 사이즈 문제

Post by 강짱 »

IE에서는 다 보이는데요..
핵을 써야 할것 같은데..
어떻게 써야 할지....
답변 부탁드려요~ㅜㅜ
Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Bing [Bot] and 1 guest