묻고답하기

  2. Support
  3. 묻고답하기

팁에있는 ==왼쪽메뉴줄이고 오른쪽에 박스만들어 내용쉽게넣기===질문

2008.04.10 16:30

뽀칠이

전체이미지가 가로 1002 세로 242 그림을 3개로 잘라서
로그인부분에 가로 22 세로 242 그림 하나 넣고
본문 부문에 가로 878 세로 242 그림 넣고
오른쪽에 가로 102 세로 242 그림을 넣을려고 합니다.

정상적으로는 123 이런식으로 그림이 보여야하는데
(1번 그림파일 2번 본문플래시  3번 그림파일)
적용을 하고나면 이상하게

132 이런식으로순서가 나오는것 입니다.
값을 조금 변경하고 나면 12 나오고 3은 아래로 나와 버리는것입니다.

아마도 css에 값을 잘못한것 같은데..

조절하는것 다시 한번 알려주시면 감사하겟습니다.
허더부문에 사이즈는1002로 변경했습니다.

아래는 제가 수정해서 쓰고 있는것입니다.

@charset "utf-8";
/*
NHN UIT Lab. WebStandardization Team (http://html.nhndesign.com/)
Jeong, Chan Myeong 070601~070630
*/

/* White Skin - Start */
#selectLang { margin:0; padding:0; }
#gnb { margin:0; padding:0; }
#lnb { margin:0; padding:0; }
#lnb ul { margin:0; padding:0; }

/* Site Layout - Body Wrap */
body { background:#ffffff;}
#bodyWrap { position:relative; width:1002px; margin:0 auto; padding:1.5em 0 0 0;}

/* Site Layout - Header */
#header { position:relative; width:1002px; height:114px; border-top:6px solid #323232; border-left:1px solid #d9d9d9; border-right:1px solid #d9d9d9; background:url(../images/white/bgHeader.png) no-repeat right bottom; margin-bottom:10px; z-index:99;}
#header h1 { position:absolute; top:26px; left:25px;}
#header h2 { position:absolute; top:75px; right:0px;}

#language { position:absolute; top:12px; right:19px; z-index:100;}
#language strong { color:#5c5c5c; font:.75em Tahoma; margin-right:3px;}
#language a img { vertical-align:-5px;}
#language ul { position:absolute; top:15px; right:0px; display:none; border:1px solid #d9d9d9; background:#ffffff;}
#language ul li { list-style:none; }
#language ul li a { display:block; width:61px; padding:3px 8px; font:9px Tahoma; color:#5c5c5c; text-decoration:none;}
#language ul li a:hover { background:#f4f4f4;}

#it_search_form { position:absolute; top:50px; right:15px;}
#it_search_form .input { border:1px solid #d9d9d9; height:17px; width:120px; color:#888888; font-size:.9em;}
#it_search_form .submit_button { width:1px; height:1px; visibility:hidden; }

#gnb { position:absolute; top:76px; left:0; height:38px; overflow:hidden; white-space:nowrap; margin-bottom:10px;}
#gnb li { list-style:none; float:left; background:url(../images/white/bgGnbVr.gif) no-repeat left center; padding-left:2px; position:relative; left:-2px; white-space:nowrap;}
#gnb li a { display:block; float:left; padding:13px 15px 0 15px; height:25px; color:#727272; white-space:nowrap; text-decoration:none; }
#gnb li a:hover,
#gnb li a:focus { color:#000000;}
#gnb li.on a { font-weight:bold; color:#3f3f3f; background:url(../images/white/bgGnbOn.gif) no-repeat center top;}

#isSearch { position:absolute; top:48px; right:15px; width:214px; text-align:right;}
#isSearch .searchOrder { display:none;}
#isSearch .checked { position:absolute; left:0; top:0; text-align:left; display:block; padding:5px 0 0 5px; width:64px; height:14px; background:url(../images/white/bgSearchTerm.gif) no-repeat; font:11px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; color:#5c5c5c; line-height:normal;}
#isSearch ul { display:none; position:absolute; left:0; top:18px; padding:2px 0 3px 0; text-align:left; border:1px solid #b2b2b2; background:#ffffff; overflow:hidden;}
#isSearch ul li { width:67px; height:18px; list-style:none;}
#isSearch ul li input { display:none;}
#isSearch ul li label { display:block; padding:4px 0 0 4px; width:63px; height:15px; font:11px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; color:#5c5c5c;}
#isSearch ul li label.on { background:#ededed; }
#isSearch ul li label:hover,
#isSearch ul li label:focus { background:#ededed;}
#isSearch .inputText { vertical-align:middle; position:relative; top:0; _top:-1px; left:1px; padding:3px 3px 1px 3px; width:94px; height:13px; color:#000000; border:1px solid #B0B0AF; background-color:#FFFFFF; }
#isSearch .inputText:hover,
#isSearch .inputText:focus { border:1px solid #8E8E8D; background-color:#FFFFFF; }
*:first-child+html  #isSearch .inputText { position:relative; top:-1px;}
#isSearch .submit { vertical-align:middle; _position:relative; _top:-1px;}
*:first-child+html #isSearch .submit { position:relative; top:-1px;}

/* Site Layout - Content Body */
#contentBody { position:relative; width:1002pX; padding-bottom:30px; overflow:hidden; border-bottom:1px solid #dddddd;}

/* Site Layout - Column Left */
#columnLeft { position:relative; width:22px; float:left;}
#columnLeft .mask { width:22px; height:242px; background:#ffffff; display:block; clear:both;}

#lnb { border-top:1px solid #dddddd; padding:4px 5px; width:190px;}
#lnb li { list-style:none; padding-bottom:4px;}
#lnb li a { padding:6px 5px 6px 13px; width:170px; display:block; border:1px solid #e8e8e8; background:url(../images/white/bgLnbOff.gif) repeat-x; color:#3e3e3e; position:relative; z-index:99; text-decoration:none;}
#lnb li a:hover,
#lnb li a:focus { color:#ffffff; background:#de4332; border:1px solid #de4332;}
#lnb li.on a { color:#ffffff; background:#de4332; border:1px solid #de4332;}
#lnb li.on a:hover,
#lnb li.on a:focus { font-weight:bold;}
#lnb li ul { display:block; position:relative; width:184px; padding:0 3px; position:relative; border-top:1px solid #ffffff; overflow:hidden;}
#lnb li.on ul { display:block;}
#lnb li ul li { padding:0; border-top:1px solid #f2f2f2; position:relative; top:-1px;}
#lnb li ul li a { padding:6px 5px 6px 10px; width:169px; color:#818181 !important; border:none; background:none !important; border:none !important;}
#lnb li ul li a:hover,
#lnb li ul li a:focus { font-weight:normal !important; color:#de4332 !important;}
#lnb li.on ul li.on a { color:#ff1a00 !important; font-weight:bold !important; background:url(../images/white/bulletLnb.gif) no-repeat 175px center  !important;}

/* Site Layout - Column Right */
#columnRight { width:878px; float:right; overflow:hidden;}
#visualArea { width:878Px; height:242px; background:#f5f5f5; margin-bottom:2.5em; position:relative; left:-15px; margin-right:-15px;}
#content { width:100%; overflow:hidden;}

#mainright { position:relative; float:right; margin-top:0px; width:102px; background:#f7f7f7; border:0px solid #e7e7e7;}

/* Site Layout - Footer */
#footer { margin:0; padding:0; border-top:3px solid #f4f4f4; text-align:center; padding:2em 0 4em; clear:both;}
#footer li { display:inline; padding:0 .6em 0 1em; background:url(../images/white/vrType1.gif) no-repeat left center;}
#footer li.first-child { background:none;}
#footer li a { color:#999999; font:.9em "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#footer li address { display:inline; }

/* White Skin - End */

 

잘못된 부분 지적 부탁하겟습니다.

문제의 주소
http://220.66.72.2/~srla/zbxe/?mid=test2



한가지 더ㅣ 질문 드리겠습니다.

오른쪽에 와야할 그림이 f5를 누르고 보면 높이가 좁게 나오는데.
마우스로 클릭하면 커지는게 무슨 이유인가요?

이 게시물을
좋아요
목록
글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
도봉인포 네이버 지도 에러.. [1] 2008.04.11 by test
Jang suk Kwon 에러하고 관련된 글입니다. 0.1.0에서 1.0. 업글중에  
skyu9 iframe을 사용한 후~~ [1] 2008.04.11 by J..
james 게시물 제목 마우스 오버=> 내용 미리보기 기능 구현  
한규성. 썸네일 용량제한??? [2] 2008.04.11 by 한규성.
greenalice 이미지 등록시 ALT 태그가 적용 안되게 하는 방법을 모르겠습니다...;;;ㅠ_ㅠ [3] 2008.04.11 by greenalice
뽀칠이 layou 전체를 좌측으로 정렬 [1] 2008.04.11 by 똑디
꽝꽝꽝 ''웹진 형태 최근 문서 출력'' 위젯 오류!! 꼭 좀 도와주세요~!!!  
김유성192 2.3차메뉴에 관하여 질문드립니다~ [2] 2008.04.11 by 김유성192
궁금이 [급]다음과 같은 금지ip가 뜹니다. 푸는 방법과 여럿이 동시에 게시판사용시 file  
막장의홈피 홈페이지를만드는데 어떻게하는건지요. [3] 2008.04.11 by 늘미소
뽀칠이 팁에있는 ==왼쪽메뉴줄이고 오른쪽에 박스만들어 내용쉽게넣기===질문 [1] 2008.04.11 by plruto
서영훈863 제발점 도와주셔영 ㅠ_ㅠ [1] file 2008.04.11 by J..
imsilc 레이아웃 일괄적용이 안됩니다. [2] 2008.04.11 by 박형근711
뽀칠이 footer 부분에 위젯 적용 할수 없나요? [2] 2008.04.11 by forest535
박진우730 레이아웃 수정관련 초보좀 꼭 도와주세요 ..T.T [1] file 2008.04.10 by forest535
수학사랑. mysql 4.0.27 일 경우 zbxe 설치는 어떻게... [1] 2008.04.10 by 손님1
Jinbo 홈 페이지에서 아이콘?? 질문드려요~~ [3] 2008.04.10 by J..
늘미소 회원 - 추가된 항목을 이용하기 위해 다음과 같이 작성해보았는데 도움을 부탁드립니다.  
궁금이 동시에 게시판에 글을 올릴때 60초나 ip경고가 나올때 제거하는법은요? [2] 2008.04.10 by 흑묘백묘
저하늘구름 질문 사진을 올리는 법입니다. [3] 2008.04.10 by 저하늘구름
브롬화칼륨 회원 목록 관리  
카멜레온* 갤러리게시판에서 사진 클릭하면... [3] 2008.04.10 by 카멜레온*
ilove 댓글의 에디터 안보이게 할순 없나요 [5] 2008.04.10 by ㅗㅗ
개구락지 [수정] 레이아웃 (스킨) 변경후 문제점... [4] file 2008.04.10 by 개구락지
cshong 기초적인 질문 :: 공부하는 방법  
hers 댓글 등록시 글자색 수정.... [1] 2008.04.10 by 백성찬
나문기 서브메뉴를 이미지 버튼으로 교체했는데.. [2] file 2008.04.10 by 언약
jineeya 설문조사 모듈 관련하여... [1] 2008.04.10 by J..
한석희994 왕초보 질문 타사이트 페이지 표출 [5] 2008.04.10 by 백성찬
태그 쓰기