최근글 게시판별 배치도
본문
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구문을 다음과 같이 추가하면 옆으로 붙으실겁니다.
정말 감사합니다. 그런데 위의 이미지 처럼
1. 공지와 갤러리 박스 사이에 간격을 주는 문제
2. 갤러리와 공지의 가로 배열이 같게 하는 문제
는 어디를 만져야 하는지요?
답변을 작성하시기 전에 로그인 해주세요.