연혁 게시판 문의

연혁 게시판 문의

QA

SIR 제작의뢰 - 견적무료/익명보정/호스팅, DB 이전/단기개발. 이젠 ' 의뢰인'이 원하는 '제작자'에게만 연락처를 알릴 수 있습니다.

연혁 게시판 문의

본문

썸네일 연혁 게시판(FullstackCreative)을 사용중입니다.990366654_1556007748.6629.jpg

 

홈페이지 가로폭이 1200px로 테스트하면 위 그림중 2019년 처럼 위아래로 정렬이 잘되는데

제가 사용하는 본문 폭은 890px인데 위 그림처럼 나오네요.

아래는 list.php와 style.css입니다.

고수님들의 조언 부탁드립니다.

 

 

list.php--------------------------------------------------------------------------------------

<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
include_once(G5_LIB_PATH.'/thumbnail.lib.php');

// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$board_skin_url.'/style.css">', 0);
?>

<form name="fboardlist" id="fboardlist" action="./board_list_update.php" onsubmit="return fboardlist_submit(this);" method="post">
<input type="hidden" name="bo_table" value="<?php echo $bo_table ?>">
<input type="hidden" name="sfl" value="<?php echo $sfl ?>">
<input type="hidden" name="stx" value="<?php echo $stx ?>">
<input type="hidden" name="spt" value="<?php echo $spt ?>">
<input type="hidden" name="sca" value="<?php echo $sca ?>">
<input type="hidden" name="sst" value="<?php echo $sst ?>">
<input type="hidden" name="sod" value="<?php echo $sod ?>">
<input type="hidden" name="page" value="<?php echo $page ?>">
<input type="hidden" name="sw" value="">

<div id="history_his">

<?php
$j = "0";
$l = "0";
$sql = " select * from {$write_table} where wr_is_comment = 0 order by wr_subject desc, wr_1*1 desc ";
$result = sql_query($sql);
for($i=0; $row[$i]=sql_fetch_array($result); $i++) {
    $j++;
    $k = $i - 1;
    $m = $i - 2;
    if ($row[$k]['wr_subject']!=$row[$i]['wr_subject']){ $l = $l+1; }
    $atc_class = "history_h_atc_".$l%2;
?>

    <?php
    if ($row[$k]['wr_subject']!=$row[$i]['wr_subject']){
    ?>

    <div class="history_h_w">

        <h1 class="history_h_h1"><?php echo $row[$i]['wr_subject']; ?></h1>

        <?php
        $thumb = get_list_thumbnail($bo_table, $row[$i]['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height']);
        if($thumb['src']) {
        ?>
        
        <div class="history_h_thumb_wrap" style="background:url('<?php echo $thumb['src'] ?>') center top no-repeat;">
            <img src="<?php echo $board_skin_url ?>/img/pic_bg.png">
        </div>

        <?php } ?>

    <?php } ?>

        <table cellspacing="0" cellpadding="0" class="history_h_atc <?php echo $atc_class ?>">
            <tr style="margin-right:100px;">
                <?php if ($l%2=='0'){ ?>
                <td><?php echo nl2br($row[$i]['wr_content']).'<br>'; ?></td>
                <th>
                    <?php echo sprintf("%02d",$row[$i]['wr_1']); ?>월
                    <?php if ($is_checkbox) { ?>
                    <div class="history_chk history_chk_0">
                        <input type="checkbox" name="chk_wr_id[]" value="<?php echo $row[$i]['wr_id'] ?>" id="chk_wr_id_<?php echo $i ?>">
                        <span><a href="<?php echo G5_BBS_URL ?>/write.php?w=u&bo_table=<?php echo $bo_table ?>&wr_id=<?php echo $row[$i]['wr_id'] ?>">[수정]</a></span>
                    </div>
                    <?php } ?>
                </th>
                <?php } else { ?>
                <th>
                    <?php if ($is_checkbox) { ?>
                    <div class="history_chk history_chk_1">
                        <span><a href="<?php echo G5_BBS_URL ?>/write.php?w=u&bo_table=<?php echo $bo_table ?>&wr_id=<?php echo $row[$i]['wr_id'] ?>">[수정]</a></span>
                        <input type="checkbox" name="chk_wr_id[]" value="<?php echo $row[$i]['wr_id'] ?>" id="chk_wr_id_<?php echo $i ?>">
                    </div>
                    <?php } ?>
                    <?php echo sprintf("%02d",$row[$i]['wr_1']); ?>월
                </th>
                <td><?php echo nl2br($row[$i]['wr_content']); ?></td>
                <?php } ?>
            </tr>
        </table>

    <?php

    $row_his_num = sql_fetch(" select count(*) as cnt from {$write_table} where wr_is_comment = 0 and wr_subject = '{$row[$i]['wr_subject']}' ");
    if ($j-$row_his_num['cnt']==0){
    ?>

    </div>

    <?php
    $j = "0";
    }
    ?>

<?php } ?>

</div>

<?php if ($is_checkbox || $write_href) { ?>
<div class="bo_fx">
    <?php if ($is_checkbox) { ?>
    <ul class="btn_bo_adm">
        <li><input type="submit" name="btn_submit" value="선택삭제" onclick="document.pressed=this.value"></li>
    </ul>
    <?php } ?>

    <?php if ($write_href) { ?>
    <ul class="btn_bo_user">
        <?php if ($write_href) { ?><li><a href="<?php echo $write_href ?>" class="btn_b02">연혁등록</a></li><?php } ?>
    </ul>
    <?php } ?>
</div>
<?php } ?>

</form>

<?php if($is_checkbox) { ?>
<noscript>
<p>자바스크립트를 사용하지 않는 경우<br>별도의 확인 절차 없이 바로 선택삭제 처리하므로 주의하시기 바랍니다.</p>
</noscript>
<?php } ?>

<?php if ($is_checkbox) { ?>
<script>
function all_checked(sw) {
    var f = document.fboardlist;

    for (var i=0; i<f.length; i++) {
        if (f.elements[i].name == "chk_wr_id[]")
            f.elements[i].checked = sw;
    }
}

function fboardlist_submit(f) {
    var chk_count = 0;

    for (var i=0; i<f.length; i++) {
        if (f.elements[i].name == "chk_wr_id[]" && f.elements[i].checked)
            chk_count++;
    }

    if (!chk_count) {
        alert(document.pressed + "할 게시물을 하나 이상 선택하세요.");
        return false;
    }

    if(document.pressed == "선택삭제") {
        if (!confirm("선택한 게시물을 정말 삭제하시겠습니까?\n\n한번 삭제한 자료는 복구할 수 없습니다\n\n답변글이 있는 게시글을 선택하신 경우\n답변글도 선택하셔야 게시글이 삭제됩니다."))
            return false;

        f.removeAttribute("target");
        f.action = "./board_list_update.php";
    }

    return true;
}
</script>
<?php } ?>
<!-- } 게시판 목록 끝 -->
----------------------------------------------------------------------------------------------------------------

 

style.css-------------------------------------------------------------------------------------------------------

 

@charset "utf-8";
 

/* ### 기본 스타일 커스터마이징 시작 ### */

/* 게시판 버튼 */
/* 목록 버튼 */
#bo_list a.btn_b01 {}
#bo_list a.btn_b01:focus, #bo_list a.btn_b01:hover {}
#bo_list a.btn_b02 {}
#bo_list a.btn_b02:focus, #bo_list a.btn_b02:hover {}
#bo_list a.btn_admin {} /* 관리자 전용 버튼 */
#bo_list a.btn_admin:focus, #bo_list .btn_admin:hover {}

/* 읽기 버튼 */
#bo_v a.btn_b01 {}
#bo_v a.btn_b01:focus, #bo_v a.btn_b01:hover {}
#bo_v a.btn_b02 {}
#bo_v a.btn_b02:focus, #bo_v a.btn_b02:hover {}
#bo_v a.btn_admin {} /* 관리자 전용 버튼 */
#bo_v a.btn_admin:focus, #bo_v a.btn_admin:hover {}

/* 쓰기 버튼 */
#bo_w .btn_confirm {} /* 서식단계 진행 */
#bo_w .btn_submit {}
#bo_w button.btn_submit {}
#bo_w fieldset .btn_submit {}
#bo_w .btn_cancel {}
#bo_w button.btn_cancel {}
#bo_w .btn_cancel:focus, #bo_w .btn_cancel:hover {}
#bo_w a.btn_frmline, #bo_w button.btn_frmline {} /* 우편번호검색버튼 등 */
#bo_w button.btn_frmline {}

/* 기본 테이블 */
/* 목록 테이블 */
#bo_list .tbl_head01 {}
#bo_list .tbl_head01 caption {}
#bo_list .tbl_head01 thead th {}
#bo_list .tbl_head01 thead a {}
#bo_list .tbl_head01 thead th input {} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
#bo_list .tbl_head01 tfoot th {}
#bo_list .tbl_head01 tfoot td {}
#bo_list .tbl_head01 tbody th {}
#bo_list .tbl_head01 td {}
#bo_list .tbl_head01 a {}
#bo_list td.empty_table {}

/* 읽기 내 테이블 */
#bo_v .tbl_head01 {}
#bo_v .tbl_head01 caption {}
#bo_v .tbl_head01 thead th {}
#bo_v .tbl_head01 thead a {}
#bo_v .tbl_head01 thead th input {} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
#bo_v .tbl_head01 tfoot th {}
#bo_v .tbl_head01 tfoot td {}
#bo_v .tbl_head01 tbody th {}
#bo_v .tbl_head01 td {}
#bo_v .tbl_head01 a {}
#bo_v td.empty_table {}

/* 쓰기 테이블 */
#bo_w table {}
#bo_w caption {}
#bo_w .frm_info {}
#bo_w .frm_address {}
#bo_w .frm_file {}

#bo_w .tbl_frm01 {}
#bo_w .tbl_frm01 th {}
#bo_w .tbl_frm01 td {}
#bo_w .tbl_frm01 textarea, #bo_w tbl_frm01 .frm_input {}
#bo_w .tbl_frm01 textarea {}
/*
#bo_w .tbl_frm01 #captcha {}
#bo_w .tbl_frm01 #captcha input {}
*/
#bo_w .tbl_frm01 a {}

/* 필수입력 */
#bo_w .required, #bo_w textarea.required {}

#bo_w .cke_sc {}
#bo_w button.btn_cke_sc{}
#bo_w .cke_sc_def {}
#bo_w .cke_sc_def dl {}
#bo_w .cke_sc_def dl:after {}
#bo_w .cke_sc_def dt, #bo_w .cke_sc_def dd {}
#bo_w .cke_sc_def dt {}
#bo_w .cke_sc_def dd {}

/* ### 기본 스타일 커스터마이징 끝 ### */

/* 게시판 목록 */
#bo_list .td_board {width:120px;text-align:center}
#bo_list .td_chk {width:30px;text-align:center}
#bo_list .td_date {width:60px;text-align:center}
#bo_list .td_datetime {width:110px;text-align:center}
#bo_list .td_group {width:100px;text-align:center}
#bo_list .td_mb_id {width:100px;text-align:center}
#bo_list .td_mng {width:80px;text-align:center}
#bo_list .td_name {width:100px;text-align:left}
#bo_list .td_nick {width:100px;text-align:center}
#bo_list .td_num {width:50px;text-align:center}
#bo_list .td_numbig {width:80px;text-align:center}

#bo_list .txt_active {color:#5d910b}
#bo_list .txt_expired {color:#ccc}

#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {margin-bottom:10px;padding-left:1px;zoom:1}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {float:left;margin-bottom:-1px}
#bo_cate a {display:block;position:relative;margin-left:-1px;padding:6px 0 5px;width:90px;border:1px solid #ddd;background:#f7f7f7;color:#888;text-align:center;letter-spacing:-0.1em;line-height:1.2em;cursor:pointer}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none}
#bo_cate #bo_cate_on {z-index:2;border:1px solid #565e60;background:#fff;color:#565e60;font-weight:bold}

.td_subject img {margin-left:3px}

/* 게시판 목록 공통 */
.bo_fx {margin-bottom:5px;zoom:1}
.bo_fx:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx ul {margin:0;padding:0;list-style:none}
#bo_list_total {float:left;padding-top:5px}
.btn_bo_user {float:right;margin:0;padding:0;list-style:none}
.btn_bo_user li {float:left;margin-left:5px}
.btn_bo_adm {float:left}
.btn_bo_adm li {float:left;margin-right:5px}
.btn_bo_adm input {padding:8px;border:0;background:#e8180c;color:#fff;text-decoration:none;vertical-align:middle}
.bo_notice td {background:#f5f6fa}
.bo_notice td a {font-weight:bold}
.td_num strong {color:#000}
.bo_cate_link {display:inline-block;margin:0 3px 0 0;padding:0 6px 0 0;border-right:1px solid #e7f1ed;color:#999 !important;font-weight:bold;text-decoration:none} /* 글제목줄 분류스타일 */
.bo_current {color:#e8180c}
#bo_list .cnt_cmt {display:inline-block;margin:0 0 0 3px;font-weight:bold}

#bo_sch {margin-bottom:10px;padding-top:5px;text-align:center}
#bo_sch legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}

/* 게시판 쓰기 */
#char_count_desc {display:block;margin:0 0 5px;padding:0}
#char_count_wrap {margin:5px 0 0;text-align:right}
#char_count {font-weight:bold}

#autosave_wrapper {position:relative}
#autosave_pop {display:none;z-index:10;position:absolute;top:24px;right:117px;padding:8px;width:350px;height:auto !important;height:180px;max-height:180px;border:1px solid #565656;background:#fff;overflow-y:scroll}
html.no-overflowscrolling #autosave_pop {height:auto;max-height:10000px !important} /* overflow 미지원 기기 대응 */
#autosave_pop strong {position:absolute;font-size:0;line-height:0;overflow:hidden}
#autosave_pop div {text-align:right}
#autosave_pop button {margin:0;padding:0;border:0;background:transparent}
#autosave_pop ul {margin:10px 0;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#autosave_pop li {padding:8px 5px;border-bottom:1px solid #e9e9e9;zoom:1}
#autosave_pop li:after {display:block;visibility:hidden;clear:both;content:""}
#autosave_pop a {display:block;float:left}
#autosave_pop span {display:block;float:right}
.autosave_close {cursor:pointer}
.autosave_content {display:none}

/* 게시판 읽기 */
#bo_v {margin-bottom:20px;padding-bottom:20px}

#bo_v_table {position:absolute;top:0;right:16px;margin:0;padding:0 5px;height:25px;background:#ff3061;color:#fff;font-weight:bold;line-height:2.2em}

#bo_v_title {padding:10px 0;font-size:1.2em}

#bo_v_info {padding:0 0 10px;border-bottom:1px solid #ddd}
#bo_v_info h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_info strong {display:inline-block;margin:0 15px 0 5px;font-weight:normal}
#bo_v_info .sv_member,
#bo_v_info .sv_guest,
#bo_v_info .member,
#bo_v_info .guest {font-weight:bold}

#bo_v_file {}
#bo_v_file h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_file ul {margin:0;padding:0;list-style:none}
#bo_v_file li {padding:0 10px;border-bottom:1px solid #eee;background:#f5f6fa}
#bo_v_file a {display:inline-block;padding:8px 0 7px;width:100%;color:#000;word-wrap:break-word}
#bo_v_file a:focus, #bo_v_file a:hover, #bo_v_file a:active {text-decoration:none}
#bo_v_file img {float:left;margin:0 10px 0 0}
.bo_v_file_cnt {display:inline-block;margin:0 0 3px 16px}

#bo_v_link {}
#bo_v_link h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_link ul {margin:0;padding:0;list-style:none}
#bo_v_link li {padding:0 10px;border-bottom:1px solid #eee;background:#f5f6fa}
#bo_v_link a {display:inline-block;padding:8px 0 7px;width:100%;color:#000;word-wrap:break-word}
#bo_v_link a:focus, #bo_v_link a:hover, #bo_v_link a:active {text-decoration:none}
.bo_v_link_cnt {display:inline-block;margin:0 0 3px 16px}

#bo_v_top {margin:0 0 10px;padding:10px 0;zoom:1}
#bo_v_top:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_top h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_top ul {margin:0;padding:0;list-style:none}

#bo_v_bot {zoom:1}
#bo_v_bot:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_bot h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_bot ul {margin:0;padding:0;list-style:none}

.bo_v_nb {float:left}
.bo_v_nb li {float:left;margin-right:5px}
.bo_v_com {float:right}
.bo_v_com li {float:left;margin-left:5px}

#bo_v_atc {min-height:200px;height:auto !important;height:200px}
#bo_v_atc_title {position:absolute;font-size:0;line-height:0;overflow:hidden}

#bo_v_img {margin:0 0 10px;width:100%;overflow:hidden;zoom:1}
#bo_v_img:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_img img {margin-bottom:20px;max-width:100%;height:auto}

#bo_v_con {margin-bottom:30px;width:100%;line-height:1.7em;word-break:break-all;overflow:hidden}
#bo_v_con a {color:#000;text-decoration:underline}
#bo_v_con img {max-width:100%;height:auto}

#bo_v_act {margin-bottom:30px;text-align:center}
#bo_v_act .bo_v_act_gng {position:relative}
#bo_v_act a {margin-right:5px;vertical-align:middle}
#bo_v_act strong {color:#ff3061}
#bo_v_act_good, #bo_v_act_nogood {display:none;position:absolute;top:30px;left:0;padding:10px 0;width:165px;background:#ff3061;color:#fff;text-align:center}

#bo_v_sns {margin:0 0 20px;padding:0;list-style:none;zoom:1}
#bo_v_sns:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_sns li {float:left;margin:0 5px 0 0}

/* 게시판 댓글 */
#bo_vc {margin:0 0 20px;padding:20px 20px 10px;border:1px solid #e5e8ec;background:#f5f8f9}
#bo_vc h2 {margin-bottom:10px}
#bo_vc article {padding:0 0 10px;border-top:1px dotted #ccc}
#bo_vc header {position:relative;padding:15px 0 5px}
#bo_vc header .icon_reply {position:absolute;top:15px;left:-20px}
#bo_vc .sv_wrap {margin-right:15px}
#bo_vc .member, #bo_vc .guest, #bo_vc .sv_member, #bo_vc .sv_guest {font-weight:bold}
.bo_vc_hdinfo {display:inline-block;margin:0 15px 0 5px}
#bo_vc h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_vc a {color:#000;text-decoration:none}
#bo_vc p {padding:0 0 5px;line-height:1.8em}
#bo_vc p a {text-decoration:underline}
#bo_vc p a.s_cmt {text-decoration:none}
#bo_vc_empty {margin:0;padding:20px !important;text-align:center}
#bo_vc #bo_vc_winfo {float:left}
#bo_vc footer {zoom:1}
#bo_vc footer:after {display:block;visibility:hidden;clear:both;content:""}

.bo_vc_act {float:right;margin:0;list-style:none;zoom:1}
.bo_vc_act:after {display:block;visibility:hidden;clear:both;content:""}
.bo_vc_act li {float:left;margin-left:5px}

#bo_vc_w {position:relative;margin:0 0 10px;padding:0 0 20px;border-bottom:1px solid #cfded8}
#bo_vc_w h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_vc_w #char_cnt {display:block;margin:0 0 5px}

#bo_vc_sns {margin:0;padding:0;list-style:none;zoom:1}
#bo_vc_sns:after {display:block;visibility:hidden;clear:both;content:""}
#bo_vc_sns li {float:left;margin:0 20px 0 0}
#bo_vc_sns input {margin:0 0 0 5px}


/* history */
.history_h_w { display:flow-root; width:100%; height:fit-content; padding-bottom:10px; margin:40px auto 0 auto; font-family:'NotoKrR', sans-serif; background: #f9f9f9 url('./img/his_bg.jpg') center top no-repeat; }
.history_h_w2 { margin:40px auto !important; }
.history_h_h1 { text-align:center; padding-bottom:10px; font-size:50px; font-weight:700; color:#3c7ac7; letter-spacing:-0.35px; }
.history_h_thumb_wrap { width:258px; height:261px; margin:8px auto; }

.history_h_atc { position:relative; display:inline-table; width:55%; margin:8px 0; background-image:url('./img/his_dot.png'); background-repeat:no-repeat; }
.history_h_atc > tbody > tr > th, .history_h_atc > tbody > tr > td { vertical-align:top; }
.history_h_atc > tbody > tr > th { position:relative; width:66px; font-size:22px; font-weight:400; color:#373737; line-height:30px; }
.history_h_atc > tbody > tr > td { font-size:13.5px; font-weight:400; color:#666; line-height:30px; }
.history_h_atc_1 { left:50%; text-align:left; padding-left:27px; margin-left:-4px; background-position:left 9px; }
.history_h_atc_0 { text-align:right; padding-right:27px; margin-left:-56px; background-position:right 9px; }

.history_chk { position:absolute; top:-2px; }
.history_chk > span { position:relative; top:-2px; font-size:12px; font-weight:400; }
.history_chk > span > a { color:#e41d1d; }
.history_chk_1 { left:-90px; }
.history_chk_0 { right:-90px; }

이 글을 내 페이스북 계정으로 보내기 이 글을 내 트위터 계정으로 보내기 이 글을 내 구글플러스 계정으로 보내기

이 질문에 댓글 쓰기 :

답변 2

애드프로님의 답변

소스 전체를 주어 찾는것보다

크롬에서 F12 누르셔서 우측하단 오브젝트 누르시고 원하는 부분 찍으시면

왜 css 가 저렇게 나오는지 알수 있어요^^

주소복사
답변의 댓글

아르키어드님의 답변

css안맞는건 url을 찍어주시면 직접 가서 보시는분들이 계셔서 답변얻기가 더좋습니다.

님 말씀대로 크롬이나 파폭에서 f12 콘솔창열어서 직접찍어보시는게 좋습니다

주소복사
답변의 댓글
답변을 작성하시기 전에 로그인 해주세요.
전체 76,519 | RSS
고마운 분의 도움으로 질문을 해결하셨다면, 채택을 눌러서 감사의 마음을 전하세요.
어떻게 질문해야 할지 모른다면 질문하는 방법을 읽어 보신후 질문해 보세요.
QA 내용 검색

회원로그인

진행중 포인트경매

  1. 완피 크리미 퓨레 고양이 마약간식 10봉

    참여6 회 시작19.07.17 09:26 종료19.07.20 09:26

(주)에스아이알소프트 (06253) 서울특별시 강남구 도곡로1길 14, 6층 624호 (역삼동, 삼일프라자) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT