묻고답하기
레이아웃 위쪽에 여백이 생기네요
2008.11.10 18:27
레이아웃 강좌를 보고 레이아웃을 만들어가고 있습니다.
div 태그를 이용해 프레임을 나누고 있는데 태그와는 무관하게 윗쪽에 공란이 생기더군요.
행여 잘못친 엔터라도 있나 해서 뒤져봤지만, 의심가는건 없었습니다.
그래서 왜그러나 혼자 고민을 하다가 css와 html로 나눠져 있는 레이아웃 파일을 하나의
html로 합쳐서 시험해봤습니다. 여전히 위에 공란이 생기더군요.
그러다가 어쩌다 그 html의 <head></head>부문을 지웠더니, 글쎄 저 공란이
깔끔하게 없어지는겁니다.
그래서 헤드부분 때문인가보다 하고 수정하려고 해도, 레이아웃에서 제가 강좌를 보고
편집가능했던곳은 css파일과 html뿐인데, html은 body의 내용만을 작성하더군요.
그럼 제가 만들 홈페이지의 head부분을 수정하려면, info.xml를 수정해야하는건가요?
이게 head부분의 문제때문이 맞는지, 수정방법은 없는지 궁금합니다.
body{
margin:0;
padding:0;
overflow:hidden;
}
b{font-size: 110%;}
em{color: red;}
#topsection{
background: #EAEAEA;
height: 128px;
}
#contentwrapper{
float: left;
width: 100%;
}
#forlogin{
margin: 0 399px 0 269px;
height : 65px;
text-align : right;
}
#contentcolumn{
margin: 0 399px 0 269px;
width : 612px;
height : 777px;
}
#leftcolumn{
float: left;
width: 269px;
height : 842px;
margin-left: -100%;
background: #2f3d58;
}
#rightcolumn{
float: left;
width: 399px;
height : 842px;
margin-left: -399px;
background: #2f3d58;
}
#footer{
clear: left;
width: 100%;
height: 53px;
background: #2f3d58;
color: #FFF;
text-align: center;
font-size: 9pt;
padding: 0;
}
#footer a{
color: #FFFFff;
}
.innertube{
margin: 0px;
margin-top: 0px;
}
----------layout-------------
<!--%import("css/default.css")-->
<div id="topsection"></div>
<div id="contentwrapper">
<div id="forlogin">로그인하는곳</div>
<div id="contentcolumn">메인 디테일</div>
</div>
<div id="leftcolumn">메뉴들어갈곳</div>
<div id="rightcolumn">오른쪽 광고</div>
<div id="footer">아래쪽</div>
-------------------------------------------------
댓글 7
-
Ank.P
2008.11.10 18:52
제가 작성한 부분에선 bodywrap이란 부분이 없는데 이건 제로보드 자체에 있는건가요?
혹시나 해서 수상한 margin 값은 다 지워버렸는데 변화가 없습니다. -
에고고!! 제로보드 기본 레이아웃 수정하신줄 알고.... 쩝;;;;
-
Ank.P
2008.11.10 19:04
아 그 강좌란에 있는 초초보 레이아웃 작성 강좌를 보고 만들고있습니다 ㅎ
그 지금 올려진 소스에도
body{
margin:0;
padding:0;
}
이란 부분이 있는데, 희망이 없는걸까요 ㅠㅠ -
#topsection{
margin:0;
padding:0;
background: #EAEAEA;
width:100%;
height: 128px;
}
윗 부분을 추가해 보세요.
확인은 안 해보았습니다만...
그리고 width:100%;
도 추가하셔야 IE7 등에서 문제가 안 생길 듯...(예전에 저 구문 안 넣어서 IE7에서 문제가 발생한 경우를 보아서요... 혹시 안 넣고 IE6, IE7에서 문제가 발생하지 않는다면 안 넣으셔도.. ^^) -
참!!!
혹시 zbXE의 레이아웃 폴더에 적용해서 zbXE상에서 확인해 보신 것인가요??
그게 아니고 만드신 레이아웃 파일(layout.html)을 그냥 브라우저에서만 확인하신 것이라면 DocType을 선언하지 않아서 그럴 수도 있습니다.
확인을 위해서 html 상단에 아래의 DocType을 넣어서 보세요.
(zbXE는 레이아웃으로 만들어서 적용하면 이 녀석이 자동 적용되거든요.. ^^)<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="ko" xml:lang="ko" xmlns="http://www.w3.org/1999/xhtml"> -
Ank.P
2008.11.10 22:04
어설프게 만들긴 했어도 일단 레이아웃을 적용해서 확인한건데도 말썽이네요 ㅠㅠ
일단 위에 말씀하신대로 헤더부분에 width나 margin을 추가해줬는데
별다른 효과가 없네요 ㅠㅠ대신 레이아웃 설정에 보면 헤더 스크립트 입력하는 부분 있잖습니까?
그부분에 적은 텍스트가 윗쪽에 그대로 표시됩니다.블루웹쪽에서 설치해준건데, 혹시 설치상 뭔가 잘못됬을 가능성도 있나요?
재설치라도 해보고 싶네요.여백에 그 텍스트가 그대로 출력되네요.(붙임을 수정해놓았습니다.)
아, 그리고 추가로...댓글이나 글쓰기 할때 글이 길어지면 스크롤바가 생겨도 아래로 내려가지질 않는데
이거 뭐 익스플로어 옵션 같은걸 조절해줘야 하는건가요?
/* Site Layout - Body Wrap */
body { background:#FFFFFF url(../images/default/bgBody.gif) repeat-x left top; }
#bodyWrap { width:980px; margin:1.5em auto 0 auto; }
빨간부분이 그 여백입니다.