웹표준 코딩에서 키피라이터 이미지 처리 문제 문의합니다.
테이블할 때에는 괜찮은데..
웹표준 코딩된 것을 테이블 처리하듯 상,하단 구분 후에 설정 저장 후 테스트하니 하단의 카피라이터 이미지는 현재 고정 위치가 되어버렸네요.
게시판은 글쓰기할 세로크기가 유동적으로(특히 리스트 상태나 글 볼 때) 변화기에 테이블로 할 경우는 자동으로 하단의 카피라이터 이미지가 밑으로 내려갔는데 웹표준 코딩의 div 는 그게 아니더군요.ㅡㅡ;
리스트나, 글씨기 할 때나 글 볼 때에 세로로 크기가 커질 때마다 하단의 카피라이터를 밑으로 내려가게할려면 어떻게하나요?
이것저것해보아도 잘 안되네요.
고수님들 답변주세요.
아래는 웹페이지 소스 입니다.
-------------------------- 소스 나갑니다. ------------------------------------
[상단 파일]
<?
include_once("./_common.php");
include_once("$g4[path]/subhead.sub.php");
$g4['title'] = "";
?>
include_once("./_common.php");
include_once("$g4[path]/subhead.sub.php");
$g4['title'] = "";
?>
<div id="container">
<!-- 헤더 부분--->
<!-- 헤더 부분--->
<div id="header">
<div id="gnb_box">
<div id="gnb_logo"><br/><img src="<?=$g4['path']?>/images/logo.png" width="280" height="107" class="png24" alt="시크릿로고"/></div>
<div id="gnb_rightsetbox">
<div id="gnb_space"></div>
<? include_once("$g4[path]/topmenu.php"); ?>
<div id="gnb_box">
<div id="gnb_logo"><br/><img src="<?=$g4['path']?>/images/logo.png" width="280" height="107" class="png24" alt="시크릿로고"/></div>
<div id="gnb_rightsetbox">
<div id="gnb_space"></div>
<? include_once("$g4[path]/topmenu.php"); ?>
<div id="gnb_nav"><script>flash_p('<?=$g4['path']?>/swf/menu.swf', 614, 80);</script></div>
</div>
</div>
</div>
<div id="subtop">
<script>flash_p('<?=$g4['path']?>/swf/subtopflash.swf', 997, 231);</script>
</div>
<!--서브 레이아웃 부분--->
<div id="left_05">
<div id="left_menu"><script>flash_p('<?=$g4['path']?>/swf/left_menu05.swf', 213, 390);</script></div>
</div>
<div id="subcontent">
<div id="subcontent-area">
<div id="nav"><img src="<?=$g4['path']?>/images/nav_05.gif"></div>
<div id="subcontens">
</div>
</div>
</div>
<div id="subtop">
<script>flash_p('<?=$g4['path']?>/swf/subtopflash.swf', 997, 231);</script>
</div>
<!--서브 레이아웃 부분--->
<div id="left_05">
<div id="left_menu"><script>flash_p('<?=$g4['path']?>/swf/left_menu05.swf', 213, 390);</script></div>
</div>
<div id="subcontent">
<div id="subcontent-area">
<div id="nav"><img src="<?=$g4['path']?>/images/nav_05.gif"></div>
<div id="subcontens">
[하단파일]
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// 사용자 화면 우측과 하단을 담당하는 페이지입니다.
// 우측, 하단 화면을 꾸미려면 이 파일을 수정합니다.
?>
// 우측, 하단 화면을 꾸미려면 이 파일을 수정합니다.
?>
<!-- 카피라이트 시작 -->
</div>
</div>
</div>
<div id="footer"><img src="<?=$g4['path']?>/images/copy.gif" width="1000" height="55" alt="카피라이터"/></div>
</div>
</div>
<!-- 카피라이트 끝 -->
<?
include_once("$g4[path]/tail.sub.php");
?>
include_once("$g4[path]/tail.sub.php");
?>
---------------------------------------css 소스 ----------------------------------
@charset "utf-8";
/* CSS Document */
html, body {
height: 100%;
/**margin,padding설정은 화면에 container를 가득채웠을때,스크롤바를 제거하기 위함(기본은 여백잡힘)*/
margin: 0px;
padding: 0px;
background-image: url(images/bg.jpg);background-repeat: no-repeat;background-repeat :repeat-x;
}
/**margin,padding설정은 화면에 container를 가득채웠을때,스크롤바를 제거하기 위함(기본은 여백잡힘)*/
margin: 0px;
padding: 0px;
background-image: url(images/bg.jpg);background-repeat: no-repeat;background-repeat :repeat-x;
}
div,dl,dt,dd,ol.p,h1,h2,h3,h4,h5,h6,form {margin: 0px;padding: 0px;}
img {border:0;vertical-align:top;}
ul {list-style:none;padding:0;margin:0;}
ul,ol.dl{list-style:none}
.png24 {tmp:expression(setPng24(this));}
.png24 {tmp:expression(setPng24(this));}
/* 레이아웃 큰박스 속성 */
#container {
#container {
width: 1000px;
/*html과 body에 height 100%를 주었음으로, 여기도 100%가능*/
height: 100%;
/*박스의 중앙정렬*/
margin: auto;
text-align : left;
}
/*html과 body에 height 100%를 주었음으로, 여기도 100%가능*/
height: 100%;
/*박스의 중앙정렬*/
margin: auto;
text-align : left;
}
#header {
float:left;
width:1000px;
height: 130px;
position: relative;
}
float:left;
width:1000px;
height: 130px;
position: relative;
}
#subtop {
float: left;
width: 997px;
height:231px;
position: relative;
float: left;
width: 997px;
height:231px;
position: relative;
}
/* 회사소개 */
#left_01_01 {
#left_01_01 {
float: left;
width: 213px;
height:760px;
position: relative;
}
width: 213px;
height:760px;
position: relative;
}
#left_menu {
float: left;
width: 213px;
position: absolute;
left:0px;
top:-79px;
z-index:1;
}
float: left;
width: 213px;
position: absolute;
left:0px;
top:-79px;
z-index:1;
}
/* 조직도 */
#left_01_02 {
float: left;
width: 213px;
height:600px;
position: relative;
}
width: 213px;
height:600px;
position: relative;
}
#left_02_01 {
float: left;
width: 213px;
height:2850px;
position: relative;
}
width: 213px;
height:2850px;
position: relative;
}
#left_02_02 {
float: left;
width: 213px;
height:930px;
position: relative;
}
width: 213px;
height:930px;
position: relative;
}
/* 스텔스 */
#left_03_01 {
#left_03_01 {
float: left;
width: 213px;
height:1650px;
position: relative;
}
width: 213px;
height:1650px;
position: relative;
}
#left_03_02 {
float: left;
width: 213px;
height:350px;
position: relative;
}
width: 213px;
height:350px;
position: relative;
}
#left_04 {
float: left;
width: 213px;
height:1700px;
position: relative;
}
width: 213px;
height:1700px;
position: relative;
}
/* 견적문의 */ --->견적문의 게시판 css 입니다.
#left_05 {
#left_05 {
float: left;
width: 213px;
height: 300px;
position: relative;
}
width: 213px;
height: 300px;
position: relative;
}
#left_menu {
float: left;
width: 213px;
position: absolute;
left:0px;
top:-79px;
z-index:1;
}
float: left;
width: 213px;
position: absolute;
left:0px;
top:-79px;
z-index:1;
}
#subcontent {
float:right;
width: 784px;
position: relative;
text-align : left;
width: 784px;
position: relative;
text-align : left;
}
#subcontent #subcontent-area {
/*위에 떠있는 header에 가려지는 것을 방지하기 위해서, header의 높이만큼 padding-top값을 부여*/
padding-top: 3px;
/*내용이 footer에 겹치는 것을 방지하기 위해서 footer의 높이만큼 padding-bottom값 부여*/
padding-bottom: 55px;
/*위에 떠있는 header에 가려지는 것을 방지하기 위해서, header의 높이만큼 padding-top값을 부여*/
padding-top: 3px;
/*내용이 footer에 겹치는 것을 방지하기 위해서 footer의 높이만큼 padding-bottom값 부여*/
padding-bottom: 55px;
}
#footer {
width: 1000px;
position: relative;
clear: both;
float: left;
}
clear: both;
float: left;
}
/* 상단 박스 속성 */
#gnb_box {float:left;width:1000px;height:130px;}
#gnb_logo {float:left;width:386px;height:130px;}
#gnb_rightsetbox {float:left;width:614px;height:130px; position:relative;}
#gnb_logo {float:left;width:386px;height:130px;}
#gnb_rightsetbox {float:left;width:614px;height:130px; position:relative;}
#gnb_topmenu {float:left; height:27px; margin-top:23px; position:absolute; z-index:5; right:0;}
#gnb_topmenu li{float:left;}
#gnb_topmenu li{float:left;}
#gnb_nav {float:left;width:614px;height:80px; position:absolute; z-index:100; top:50px;}
/* 좌측 박스 속성 */
#left_flash {float:left;width:213px;}
#left_flash {float:left;width:213px;}
/* 우축 박스 속성 */
#subcontents {
float:left;
}
#subcontents {
float:left;
}
#subcontents #subcontens01 {
width: 784px;
height: 765px;
height: 765px;
position: relative;
text-align : center;
}
text-align : center;
}
#contents #contens02 {
width: 784px;
padding-left:14px
position: relative;
text-align : center;
}
position: relative;
text-align : center;
}
/* CSS Document */
댓글 2개
13년 전
소스!를 올려보시면 더 좋을 거 같습니다.
13년 전
저도
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 5130 | 13년 전 | 762 | ||
| 5129 | 13년 전 | 1766 | ||
| 5128 | 13년 전 | 932 | ||
| 5127 | 13년 전 | 514 | ||
| 5126 | 13년 전 | 764 | ||
| 5125 | 13년 전 | 1371 | ||
| 5124 | 13년 전 | 842 | ||
| 5123 | 13년 전 | 477 | ||
| 5122 | 13년 전 | 1000 | ||
| 5121 |
 다이어리펜션 |
13년 전 | 1385 | |
| 5120 | 13년 전 | 507 | ||
| 5119 | 13년 전 | 484 | ||
| 5118 | 13년 전 | 412 | ||
| 5117 | 13년 전 | 726 | ||
| 5116 | 13년 전 | 469 | ||
| 5115 | 13년 전 | 918 | ||
| 5114 | 13년 전 | 941 | ||
| 5113 |
cookieyou
|
13년 전 | 1356 | |
| 5112 | 13년 전 | 539 | ||
| 5111 | 13년 전 | 830 | ||
| 5110 | 13년 전 | 4441 | ||
| 5109 | 13년 전 | 1063 | ||
| 5108 | 13년 전 | 422 | ||
| 5107 | 13년 전 | 498 | ||
| 5106 | 13년 전 | 643 | ||
| 5105 | 13년 전 | 1108 | ||
| 5104 | 13년 전 | 415 | ||
| 5103 |
프로프리랜서
|
13년 전 | 1350 | |
| 5102 | 13년 전 | 1591 | ||
| 5101 | 13년 전 | 466 | ||
| 5100 | 13년 전 | 376 | ||
| 5099 | 13년 전 | 524 | ||
| 5098 | 13년 전 | 2138 | ||
| 5097 | 13년 전 | 384 | ||
| 5096 | 13년 전 | 536 | ||
| 5095 | 13년 전 | 389 | ||
| 5094 | 13년 전 | 398 | ||
| 5093 | 13년 전 | 882 | ||
| 5092 | 13년 전 | 1073 | ||
| 5091 | 13년 전 | 427 | ||
| 5090 | 13년 전 | 519 | ||
| 5089 | 13년 전 | 964 | ||
| 5088 | 13년 전 | 422 | ||
| 5087 | 13년 전 | 1176 | ||
| 5086 | 13년 전 | 1513 | ||
| 5085 |
 불편한진실 |
13년 전 | 3945 | |
| 5084 |
alexseo
|
13년 전 | 926 | |
| 5083 | 13년 전 | 1131 | ||
| 5082 | 13년 전 | 608 | ||
| 5081 | 13년 전 | 532 | ||
| 5080 | 13년 전 | 612 | ||
| 5079 | 13년 전 | 992 | ||
| 5078 | 13년 전 | 2210 | ||
| 5077 | 13년 전 | 684 | ||
| 5076 |
몰보는거야
|
13년 전 | 1696 | |
| 5075 |
 cshop |
13년 전 | 1775 | |
| 5074 | 13년 전 | 2023 | ||
| 5073 |
cshop |
13년 전 | 776 | |
| 5072 |
프로프리랜서
|
13년 전 | 1045 | |
| 5071 |
프로프리랜서
|
13년 전 | 768 | |
| 5070 |
프로프리랜서
|
13년 전 | 880 | |
| 5069 |
뭐먹고살지ㅠ
|
13년 전 | 795 | |
| 5068 |
danielle
|
13년 전 | 656 | |
| 5067 | 13년 전 | 766 | ||
| 5066 | 13년 전 | 837 | ||
| 5065 | 13년 전 | 911 | ||
| 5064 | 13년 전 | 1724 | ||
| 5063 | 13년 전 | 443 | ||
| 5062 | 13년 전 | 834 | ||
| 5061 | 13년 전 | 589 | ||
| 5060 | 13년 전 | 396 | ||
| 5059 |
senseme
|
13년 전 | 869 | |
| 5058 | 13년 전 | 2886 | ||
| 5057 | 13년 전 | 1943 | ||
| 5056 | 13년 전 | 1499 | ||
| 5055 | 13년 전 | 456 | ||
| 5054 |
senseme
|
13년 전 | 1072 | |
| 5053 |
senseme
|
13년 전 | 1912 | |
| 5052 |
senseme
|
13년 전 | 1039 | |
| 5051 |
senseme
|
13년 전 | 1062 | |
| 5050 |
senseme
|
13년 전 | 808 | |
| 5049 |
senseme
|
13년 전 | 993 | |
| 5048 | 13년 전 | 1995 | ||
| 5047 | 13년 전 | 498 | ||
| 5046 |
우렁찬우렁이
|
13년 전 | 891 | |
| 5045 |
크라이스트
|
13년 전 | 2162 | |
| 5044 | 13년 전 | 974 | ||
| 5043 | 13년 전 | 538 | ||
| 5042 | 13년 전 | 984 | ||
| 5041 |
 HARUNET |
13년 전 | 815 | |
| 5040 |
스마일라니
|
13년 전 | 884 | |
| 5039 | 13년 전 | 1155 | ||
| 5038 | 13년 전 | 1932 | ||
| 5037 | 13년 전 | 1053 | ||
| 5036 |
cookieyou
|
13년 전 | 1406 | |
| 5035 | 13년 전 | 502 | ||
| 5034 | 13년 전 | 567 | ||
| 5033 | 13년 전 | 490 | ||
| 5032 | 13년 전 | 440 | ||
| 5031 | 13년 전 | 733 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기