최근글 게시판별 배치도

최근글 게시판별 배치도

QA

최근글 게시판별 배치도

답변 2

본문

3553041288_1596441536.7989.jpg

 

 

company 테마를 이용해 홈페이지를 만들었습니다.

초기화면의 최근글 배치가 아래로 노출이 됩니다.

가로로 배치를 하려고 하는데 css 와 index를 어디를 수정을 해야하는지요?

아래는 관련 index  소스와 관련 css 입니다.
고수님들 좀 도와주시면 감사합니다.



<div id="comp_lt">
    <div class="li_notice">
        <?php
        // 이 함수가 바로 최신글을 추출하는 역할을 합니다.
        // 사용방법 : latest(스킨, 게시판아이디, 출력라인, 글자수);
        // 테마의 스킨을 사용하려면 theme/basic 과 같이 지정
        echo latest('theme/basic', 'notice', 4, 18);
        ?>
    </div>
      <div class="li_gall">
        <?php
        // 이 함수가 바로 최신글을 추출하는 역할을 합니다.
        // 사용방법 : latest(스킨, 게시판아이디, 출력라인, 글자수, 캐시타임, option);
        // 테마의 스킨을 사용하려면 theme/basic 과 같이 지정
        $options = array(
            'thumb_width'    => 143, // 썸네일 width
            'thumb_height'   => 89,  // 썸네일 height
            'content_length' => 40   // 간단내용 길이
        );
        echo latest('theme/gallery', 'gallery', 3, 25,1, $options);
        ?>
    </div>   </div>
    


---------------------
▼ 관련 css
   

#comp_if{float:left;border-left:1px solid #c8d7d6;border-right:1px solid #c8d7d6}
#comp_if li{height:192px;width:248px;border-top:1px solid #eee;position:relative}
#comp_if li h2{position:absolute;top:25px;left:20px;font-size:1.333em}
#comp_if li p{position:absolute;top:50px;left:20px;color:#566472;font-size:1.083em;line-height:1.4em}
#comp_if li a{display:block;width:100%;height:100%;text-indent:-99999px;overflow:hidden}
#comp_if li.com_bg1 a{background:url(../img/com_bg1.jpg) no-repeat bottom right #e7f0f6}
#comp_if li.com_bg2 a{background:url(../img/com_bg2.jpg) no-repeat bottom right #2676c5}
#comp_if li.com_bg2 h2,#comp_if li.com_bg2 p {color:#fff}
#comp_if li.com_bg3 a{background:url(../img/com_bg3.jpg) no-repeat bottom right #e7f0f6}
#comp_if li:first-child{border:none}
#comp_lt{float:left;padding:25px;width:900px;overflow:hidden}
#comp_lt .li_notice{border-bottom:1px solid #eee;padding-bottom:30px;height:140px;}
#comp_lt .li_gall{border-bottom:1px solid #eee;padding-bottom:30px;height:140px;}
    

이 질문에 댓글 쓰기 :

답변 2

#comp_lt{float:left;padding:25px;width:900px;overflow:hidden}
#comp_lt:after{content:''; clear:both;display : table;}
#comp_lt .li_notice{border-bottom:1px solid #eee;padding-bottom:30px;height:140px;float:left;}
#comp_lt .li_gall{border-bottom:1px solid #eee;padding-bottom:30px;height:140px;float:left;}

css구문을 다음과 같이 추가하면 옆으로 붙으실겁니다.

thumb-3553041288_1596443118.0754_730x163.jpg

 

 

정말 감사합니다. 그런데 위의 이미지 처럼
1. 공지와 갤러리 박스 사이에 간격을 주는 문제
2. 갤러리와 공지의 가로 배열이 같게 하는 문제
는 어디를 만져야 하는지요?

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 52
© SIRSOFT
현재 페이지 제일 처음으로