03.HTML 4.X, HTML5, XML.../HTML/Css/Script

ie6에서 프레임 사용시 가로스크롤이 생기는 문제

1010 2009. 10. 7. 10:43
반응형
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>테스트</title>
<meta http-equiv="imagetoolbar" content="no">
</head>
<frameset rows="*">
<frame name="index" src="/test/test.html" title="테스트">
</frameset>
<noframes>
<body oncontextmenu=return false ondragstart=return false onselectstart=return false></body>
</noframes>
</html>

IE6에서 위의 소스는 가로스크롤이 생겨버린다. 하지만 아래와 같이 하면 스크롤이 없어져 버린다.
차이점은 바로 scrolling="yes" 이것만 넣어주면 가로스크롤이 없어진다.
인터넷에서 찾아보면 다른방법도 몇가지 나오지만 아래방법이 가장 손쉽게 해결되는 솔루션임.
하지만 또 언제 무슨문제가 생길지는 모른다는거.. ^^

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>테스트</title>
<meta http-equiv="imagetoolbar" content="no">
</head>
<frameset rows="*">
<frame name="index" src="/test/test.html" title="테스트" scrolling="yes">
</frameset>
<noframes>
<body oncontextmenu=return false ondragstart=return false onselectstart=return false></body>


출처 : http://haroc.haroc.net/tc/311


--------------------------------------------

div 가운데 정렬

{margin:0 auto;}를 사용해서 센터정렬시켰는데요


ie6에서는 세로 스크롤이 생기면


세로스크롤만큼의 가로스크롤이 생겨버리는데


가로스크롤이 나오지 않게 하려면 어떻게 해야할까요?




소스입니다...

----- 프레임셋 -----


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>title</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<frameset rows="0,*" border="0" framespacing="0">
  <frame name="topFrame" noresize scrolling="no" marginwidth="0" marginheight="0" frameborder="0">
  <frame name="mainFrame" src="main.php" scrolling="auto" marginwidth="0" marginheight="0" frameborder="0">
</frameset>
</html>


-----  main.php  -----


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>title</title>

<style>

#dvWrap { margin:0 auto; width:920px;}

</style>
</head>

<body>
<div id="dvWrap">

세로스크롤이 생기면 가로스크롤이 생겨요

</div>

</body>

</html>


#dvWrap { position:absolute; left:50%; margin-left:-460px;}
margin:0 auto 대신 이렇게 써주니까 가로스크롤이 안생기네요..


세로 스크롤바가 생기면서 스크롤바의 크기만큼 영역을 차지해서 본문이 넘친다고 생각해서 가로스크롤바가 생겨나는 것 같습니다. overflow-x: hidden; 으로 하시거나 본문의 사이즈를 조금 더 늘려보세요.


overflow-x:hidden을 해보았지만 적용이 되지 않네요 IE버그라고 하는데 해결방법이 없는건지









<body style="text-align:center;">
<div sytle="width:200px;height:200px;border:1px solid red;">
</body>

와 같이 div를 center로 위치 시키면 span같은
text-level box는 가운데로 오는데, div 가운데로 오지 않는군요.

일반적으로 FF 에서는 어떤 방법으로 div를 centering을 하는지 알고 싶습니다.

물론 table속에 div를 넣는 방법은 말고 말입니다.

고견을 들려 주세요...


가운데 정렬은

코드:
body { text-align:center;}

// 먼저 전체 바디에 가운데 정렬을 줍니다.

전체 레이아웃을 시작하는 div가

코드:
<div id="wrap">

이라면

코드:
#wrap {margin:0 auto; text-align:left;}

// 텍스트는 좌측 정렬로 주고요. margin:0 auto; 이것이 가운데 정렬을 하란 말이 되겠습니다.

margin:top right bottom left; // 이런건 아시죠?
margin: 5px 5px 5px 5px; // 1번
margin:5px; // 2번
1번 = 2번
margin:5px 0 5px 0; // 3번 : 0일땐 단위를 쓰지 않고, 그 이상일 때는 단위를 씁니다.
margin:5px 0; // 4번
3번=4번

이런 식이니
margin:0 auto; 는 margin : 0 auto 0 auto; 와 같은 뜻이 되겠습니당.^^