메인화면과 게시판 길이조절 문의드립니다. 정보
메인화면과 게시판 길이조절 문의드립니다.본문
skin/cm_builder/basic/css/style.css
이곳에서
body { font-size:9pt; color: #787878; font-family:"돋음" ; text-decoration: none; line-height:155%;}
#Header {width:100%; padding:0; text-align:left;}
#Container {margin:0 auto; width:1000px; padding:15px 0 0 0; overflow:hidden; }
.position_l {float:left; width:220px;}
.position_m {float:left; width:420px; margin:0 20px 0 20px; _margin:0 8px 0 16px;}
.position_r {float:left; width:220px;}
.content {float:left; margin:0 0 0 20px; width:900px;}
#Footer {width:910px; margin:0 auto; padding:0; overflow:hidden;}
.top {width:910px; margin:40px auto 18px ; overflow:hidden;}
.top h1 {float:left; margin:0 18px 0 12px;}
.search {float:left; vertical-align:middle; margin:7px 18px 0 0;}
.search input {vertical-align:middle;}
.search input.w100 {width:100px; height:18px; background:#ffffff; border:1px solid #d6d6d6; padding:0 0 0 3px; margin:0 2px 0 0;}
.tm {float:left; margin:8px 0 0 0;}
.tm li {display:inline; border-right:1px solid #d6d6d6; margin:0 4px 0 0; padding:0 8px 0 0; .padding:0 6px 0 0; .margin:0 8px 0 0; letter-spacing: -1pt;}
.tm li.lst {border:none;}
.tmenu_bg{margin:0 auto 5px; width:100%; background:#121212; padding:5px 0 5px 0; height:28px;}
.tmenu {margin:0 auto; width:910px;}
.tmenu ul {}
.tmenu li {float:left; color:#e6e6e6; letter-spacing:-0.5pt; font-weight:bold; margin:5px 15px 5px 15px; position:relative;}
.tmenu li em {color:#ffffff;}
.tmenu li em.ov {background:#6EAA0F; padding:3px 5px 3px 5px;}
.tmenu li li{color:#313131; display:inline;}
.tmenu li div {position:absolute; top:32px; left:-15px; z-index:10; width:900px; display:none;}
.tmenu_s_bg {width:100%; border-bottom:1px dashed #d6d6d6; overflow:hidden; height:30px;}
무엇을 건드려야 하나요?
#Container {margin:0 auto; width:1000px; padding:15px 0 0 0; overflow:hidden; }
.position_l {float:left; width:220px;}
.position_m {float:left; width:420px; margin:0 20px 0 20px; _margin:0 8px 0 16px;}
.position_r {float:left; width:220px;}
.content {float:left; margin:0 0 0 20px; width:900px;}
이부분들을 몇개 건드려보고 해봤는데 갑자기 글자가 커지는등 문자열도 흐트려지네요.
메인화면부터 게시판까지 가로폭을 늘리고 싶습니다. 제 모니터가 1440 x 900 인데요.
모니터 기준으로 한 1200px까지 늘리고 싶네요.. 그래서 width를 1200px로 바꿨는데
뭐가 문제일까요.. 글자가 갑자기 커지고 모양이 흐트러지네요 ㅜㅜ;
아, 그리구 늘려놓으면 왼쪽으로 붙어버립니다.ㅜㅜ 가운데정렬<center></center>은 어디에다가 넣어야하나요?
고수님들의 답변 기다리겠습니다!!
수정) 카멜레온 빌더를 사용중인데요. 방금 관리자 설정>디자인관리>디자인설정>에
폭을 수정하는게 있길래 한번 해봤는데, 적용이 안되네요?;; 이문제는 어떻게 해야하나여 ㅜ
이곳에서
body { font-size:9pt; color: #787878; font-family:"돋음" ; text-decoration: none; line-height:155%;}
#Header {width:100%; padding:0; text-align:left;}
#Container {margin:0 auto; width:1000px; padding:15px 0 0 0; overflow:hidden; }
.position_l {float:left; width:220px;}
.position_m {float:left; width:420px; margin:0 20px 0 20px; _margin:0 8px 0 16px;}
.position_r {float:left; width:220px;}
.content {float:left; margin:0 0 0 20px; width:900px;}
#Footer {width:910px; margin:0 auto; padding:0; overflow:hidden;}
.top {width:910px; margin:40px auto 18px ; overflow:hidden;}
.top h1 {float:left; margin:0 18px 0 12px;}
.search {float:left; vertical-align:middle; margin:7px 18px 0 0;}
.search input {vertical-align:middle;}
.search input.w100 {width:100px; height:18px; background:#ffffff; border:1px solid #d6d6d6; padding:0 0 0 3px; margin:0 2px 0 0;}
.tm {float:left; margin:8px 0 0 0;}
.tm li {display:inline; border-right:1px solid #d6d6d6; margin:0 4px 0 0; padding:0 8px 0 0; .padding:0 6px 0 0; .margin:0 8px 0 0; letter-spacing: -1pt;}
.tm li.lst {border:none;}
.tmenu_bg{margin:0 auto 5px; width:100%; background:#121212; padding:5px 0 5px 0; height:28px;}
.tmenu {margin:0 auto; width:910px;}
.tmenu ul {}
.tmenu li {float:left; color:#e6e6e6; letter-spacing:-0.5pt; font-weight:bold; margin:5px 15px 5px 15px; position:relative;}
.tmenu li em {color:#ffffff;}
.tmenu li em.ov {background:#6EAA0F; padding:3px 5px 3px 5px;}
.tmenu li li{color:#313131; display:inline;}
.tmenu li div {position:absolute; top:32px; left:-15px; z-index:10; width:900px; display:none;}
.tmenu_s_bg {width:100%; border-bottom:1px dashed #d6d6d6; overflow:hidden; height:30px;}
무엇을 건드려야 하나요?
#Container {margin:0 auto; width:1000px; padding:15px 0 0 0; overflow:hidden; }
.position_l {float:left; width:220px;}
.position_m {float:left; width:420px; margin:0 20px 0 20px; _margin:0 8px 0 16px;}
.position_r {float:left; width:220px;}
.content {float:left; margin:0 0 0 20px; width:900px;}
이부분들을 몇개 건드려보고 해봤는데 갑자기 글자가 커지는등 문자열도 흐트려지네요.
메인화면부터 게시판까지 가로폭을 늘리고 싶습니다. 제 모니터가 1440 x 900 인데요.
모니터 기준으로 한 1200px까지 늘리고 싶네요.. 그래서 width를 1200px로 바꿨는데
뭐가 문제일까요.. 글자가 갑자기 커지고 모양이 흐트러지네요 ㅜㅜ;
아, 그리구 늘려놓으면 왼쪽으로 붙어버립니다.ㅜㅜ 가운데정렬<center></center>은 어디에다가 넣어야하나요?
고수님들의 답변 기다리겠습니다!!
수정) 카멜레온 빌더를 사용중인데요. 방금 관리자 설정>디자인관리>디자인설정>에
폭을 수정하는게 있길래 한번 해봤는데, 적용이 안되네요?;; 이문제는 어떻게 해야하나여 ㅜ
댓글 전체
저는 이런방식으로 했습니다.
#Header {width:100%; padding:0; text-align:left;}
#Container {margin:0 auto; width:960px; padding:15px 0 0 0; overflow:hidden; }
.position_l {float:left; width:220px;}
.position_m {float:left; width:500px; margin:0 10px 0 10px; _margin:0 8px 0 16px;}
.position_r {float:left; width:220px;}
.content {float:left; margin:0 0 0 10px; width:730px;}
#Footer {width:960px; margin:0 auto; padding:0; overflow:hidden;}
.top {width:960px; margin:10px auto 5px ; overflow:hidden;}
.top h1 {float:left; margin:0 18px 0 0px;}
.search {float:left; vertical-align:middle; margin:7px 18px 0 0;}
.search input {vertical-align:middle;}
.search input.w100 {width:100px; height:18px; background:#ffffff; border:1px solid #d6d6d6; padding:0 0 0 3px; margin:0 2px 0 0;}
.tm {float:right; margin:42px -10px 0 0;}
.tm li {display:inline; border-right:1px solid #d6d6d6; margin:0 4px 0 0; padding:0 8px 0 0; .padding:0 6px 0 0; .margin:0 8px 0 0; letter-spacing: -1pt;}
.tm li.lst {border:none;}
.tmenu_bg{margin:0 auto 5px; width:100%; background:#0f3180; padding:5px 0 5px 0; height:28px;}
.tmenu {margin:0 auto; width:960px;}
.tmenu ul {}
.tmenu li {float:left; color:#e6e6e6; letter-spacing:-0.5pt; font-weight:bold; margin:5px 35px 5px 2px; position:relative;}
.tmenu li em {color:#ffffff;}
.tmenu li em.ov {background:#6EAA0F; padding:3px 5px 3px 5px;}
.tmenu li li{color:#313131; display:inline;}
.tmenu li div {position:absolute; top:32px; left:-15px; z-index:10; width:900px; display:none;}
.search {float:right; vertical-align:middle; margin:4px 2px 0 15px;}
.search input {vertical-align:middle;}
.search input.w100 {width:100px; height:18px; background:#ffffff; border:1px solid #d6d6d6; padding:0 0 0 3px; margin:0 2px 0 0;}
.tmenu_s_bg {width:100%; border-bottom:0px dashed #d6d6d6; overflow:hidden; height:0px;}
Container가 메인화면에 해당되는 부분이라 볼수 있기 때문에 저부분에 1200px을 적어주시고
위에 960px이 중복되는 부분들이 보이실 겁니다. 이 부분도 1200px로 맞춰주시면 됩니다.
그리고 .position_l/m/r 이 부분이 다 합쳐졌을때 Container의 총 width값하고 일치해야 벗어나지 않습니다.
따라서 margin값도 그에 맞게 적절히 조절해주시구요.
#Header {width:100%; padding:0; text-align:left;}
#Container {margin:0 auto; width:960px; padding:15px 0 0 0; overflow:hidden; }
.position_l {float:left; width:220px;}
.position_m {float:left; width:500px; margin:0 10px 0 10px; _margin:0 8px 0 16px;}
.position_r {float:left; width:220px;}
.content {float:left; margin:0 0 0 10px; width:730px;}
#Footer {width:960px; margin:0 auto; padding:0; overflow:hidden;}
.top {width:960px; margin:10px auto 5px ; overflow:hidden;}
.top h1 {float:left; margin:0 18px 0 0px;}
.search {float:left; vertical-align:middle; margin:7px 18px 0 0;}
.search input {vertical-align:middle;}
.search input.w100 {width:100px; height:18px; background:#ffffff; border:1px solid #d6d6d6; padding:0 0 0 3px; margin:0 2px 0 0;}
.tm {float:right; margin:42px -10px 0 0;}
.tm li {display:inline; border-right:1px solid #d6d6d6; margin:0 4px 0 0; padding:0 8px 0 0; .padding:0 6px 0 0; .margin:0 8px 0 0; letter-spacing: -1pt;}
.tm li.lst {border:none;}
.tmenu_bg{margin:0 auto 5px; width:100%; background:#0f3180; padding:5px 0 5px 0; height:28px;}
.tmenu {margin:0 auto; width:960px;}
.tmenu ul {}
.tmenu li {float:left; color:#e6e6e6; letter-spacing:-0.5pt; font-weight:bold; margin:5px 35px 5px 2px; position:relative;}
.tmenu li em {color:#ffffff;}
.tmenu li em.ov {background:#6EAA0F; padding:3px 5px 3px 5px;}
.tmenu li li{color:#313131; display:inline;}
.tmenu li div {position:absolute; top:32px; left:-15px; z-index:10; width:900px; display:none;}
.search {float:right; vertical-align:middle; margin:4px 2px 0 15px;}
.search input {vertical-align:middle;}
.search input.w100 {width:100px; height:18px; background:#ffffff; border:1px solid #d6d6d6; padding:0 0 0 3px; margin:0 2px 0 0;}
.tmenu_s_bg {width:100%; border-bottom:0px dashed #d6d6d6; overflow:hidden; height:0px;}
Container가 메인화면에 해당되는 부분이라 볼수 있기 때문에 저부분에 1200px을 적어주시고
위에 960px이 중복되는 부분들이 보이실 겁니다. 이 부분도 1200px로 맞춰주시면 됩니다.
그리고 .position_l/m/r 이 부분이 다 합쳐졌을때 Container의 총 width값하고 일치해야 벗어나지 않습니다.
따라서 margin값도 그에 맞게 적절히 조절해주시구요.