그누 스킨 게시판처럼, 분류탭을 가지런히 정돈되게 쌓고 싶습니다.
현재 css 이며, http://www.homzzang.com/bbs/board.php?bo_table=process 상태와 같습니다.
css를 어떻게 수정하면 될까요? 참고로, 배추베이직 게시판입니다.
현재 css
-------------------
/* 분류탭 */
#mw_basic .category_tab {
width:728px; /*분류탭 길이 일정하게*/
margin-top:5px;
margin-bottom:0px;
padding:0px;
border-bottom:0px solid #515151;
}
#mw_basic .category_tab ul {
list-style:none;
margin:0;
padding:0;
height:30px;
border-right:0px solid #ddd;
}
#mw_basic .category_tab ul li {
margin:0;
display:block;
float:left;
width:120px; /*분류탭 길이 일정하게*/
height:29px;
padding:0px 12px 0 12px;
background-color:#f1f1f1;
border-top:1px solid #ddd;
border-left:1px solid #ddd;
}
*html #mw_basic .category_tab ul li {
width:120px; /*분류탭 길이 일정하게*/
height:30px;
}
#mw_basic .category_tab ul li div {
margin:7px 0 0 0;
}
#mw_basic .category_tab ul li a {
color:#515151;
font-weight:bold;
text-decoration:none;
}
#mw_basic .category_tab ul li.selected {
background-color:#515151;
height:31px;
margin-left:-1px;
margin-right:-1px;
margin-top:-1px;
}
#mw_basic .category_tab ul li.selected a {
color:#fff;
}
-----------------------------------
현재 출력 코드
-----------------------------------
<?
if ($is_category && $mw_basic[cf_category_tab]) {
$category_list = explode("|", $board[bo_category_list]);
?>
<div class="category_tab">
<ul>
<? if (!$mw_basic[cf_default_category]) { ?>
<li <? if (!$sca) echo "class='selected'";?>><div><a href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>">전체</a></div></li>
<? } ?>
<? for ($i=0, $m=sizeof($category_list); $i<$m; $i++) { ?>
<li <? if (urldecode($sca) == $category_list[$i]) echo "class='selected'";?>><div><a
href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>&sca=<?=urlencode($category_list[$i])?>"><?=$category_list[$i]?></a></div></li>
<? } ?>
</ul>
</div>
<? } ?>
---------------------------------------------
현재 css 이며, http://www.homzzang.com/bbs/board.php?bo_table=process 상태와 같습니다.
css를 어떻게 수정하면 될까요? 참고로, 배추베이직 게시판입니다.
현재 css
-------------------
/* 분류탭 */
#mw_basic .category_tab {
width:728px; /*분류탭 길이 일정하게*/
margin-top:5px;
margin-bottom:0px;
padding:0px;
border-bottom:0px solid #515151;
}
#mw_basic .category_tab ul {
list-style:none;
margin:0;
padding:0;
height:30px;
border-right:0px solid #ddd;
}
#mw_basic .category_tab ul li {
margin:0;
display:block;
float:left;
width:120px; /*분류탭 길이 일정하게*/
height:29px;
padding:0px 12px 0 12px;
background-color:#f1f1f1;
border-top:1px solid #ddd;
border-left:1px solid #ddd;
}
*html #mw_basic .category_tab ul li {
width:120px; /*분류탭 길이 일정하게*/
height:30px;
}
#mw_basic .category_tab ul li div {
margin:7px 0 0 0;
}
#mw_basic .category_tab ul li a {
color:#515151;
font-weight:bold;
text-decoration:none;
}
#mw_basic .category_tab ul li.selected {
background-color:#515151;
height:31px;
margin-left:-1px;
margin-right:-1px;
margin-top:-1px;
}
#mw_basic .category_tab ul li.selected a {
color:#fff;
}
-----------------------------------
현재 출력 코드
-----------------------------------
<?
if ($is_category && $mw_basic[cf_category_tab]) {
$category_list = explode("|", $board[bo_category_list]);
?>
<div class="category_tab">
<ul>
<? if (!$mw_basic[cf_default_category]) { ?>
<li <? if (!$sca) echo "class='selected'";?>><div><a href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>">전체</a></div></li>
<? } ?>
<? for ($i=0, $m=sizeof($category_list); $i<$m; $i++) { ?>
<li <? if (urldecode($sca) == $category_list[$i]) echo "class='selected'";?>><div><a
href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>&sca=<?=urlencode($category_list[$i])?>"><?=$category_list[$i]?></a></div></li>
<? } ?>
</ul>
</div>
<? } ?>
---------------------------------------------
댓글 6개
ul 에 height:30px 값은 제가 포함시킨 게 아니라, 원래부터 있던 소스에요.
말씀하신대로 아래처럼 넣어봤는데도, 똑같네요.
http://www.funkick.net/bbs/board.php?bo_table=info 분류탭처럼 길이 일정하게해서 탭 전체에 링크를 걸고 싶은데..
어렵네요. ㅋ
--------------------------------
/* 분류탭 */
#mw_basic .category_tab {
margin-top:5px;
margin-bottom:0px;
padding:0px;
border-bottom:0px solid #515151;
}
#mw_basic .category_tab ul {
list-style:none;
margin:0;
padding:0;
*height:30px; /*분류탭 길이 일정하게*/
border-right:0px solid #ddd;
position: relative; /*분류탭 길이 일정하게*/
}
#mw_basic .category_tab ul li {
margin:0;
display:block;
float:left;
width:120px; /*분류탭 길이 일정하게*/
height:29px;
padding:0px 12px 0 12px;
background-color:#f1f1f1;
border-top:1px solid #ddd;
border-left:1px solid #ddd;
position: relative; /*분류탭 길이 일정하게*/
}
*html #mw_basic .category_tab ul li {
width:120px; /*분류탭 길이 일정하게*/
height:30px;
}
#mw_basic .category_tab ul li div {
margin:7px 0 0 0;
}
#mw_basic .category_tab ul li a {
color:#515151;
font-weight:bold;
text-decoration:none;
}
#mw_basic .category_tab ul li.selected {
background-color:#515151;
height:31px;
margin-left:0px;
margin-right:0px;
margin-top:0px;
}
#mw_basic .category_tab ul li.selected a {
color:#fff;
}
말씀하신대로 아래처럼 넣어봤는데도, 똑같네요.
http://www.funkick.net/bbs/board.php?bo_table=info 분류탭처럼 길이 일정하게해서 탭 전체에 링크를 걸고 싶은데..
어렵네요. ㅋ
--------------------------------
/* 분류탭 */
#mw_basic .category_tab {
margin-top:5px;
margin-bottom:0px;
padding:0px;
border-bottom:0px solid #515151;
}
#mw_basic .category_tab ul {
list-style:none;
margin:0;
padding:0;
*height:30px; /*분류탭 길이 일정하게*/
border-right:0px solid #ddd;
position: relative; /*분류탭 길이 일정하게*/
}
#mw_basic .category_tab ul li {
margin:0;
display:block;
float:left;
width:120px; /*분류탭 길이 일정하게*/
height:29px;
padding:0px 12px 0 12px;
background-color:#f1f1f1;
border-top:1px solid #ddd;
border-left:1px solid #ddd;
position: relative; /*분류탭 길이 일정하게*/
}
*html #mw_basic .category_tab ul li {
width:120px; /*분류탭 길이 일정하게*/
height:30px;
}
#mw_basic .category_tab ul li div {
margin:7px 0 0 0;
}
#mw_basic .category_tab ul li a {
color:#515151;
font-weight:bold;
text-decoration:none;
}
#mw_basic .category_tab ul li.selected {
background-color:#515151;
height:31px;
margin-left:0px;
margin-right:0px;
margin-top:0px;
}
#mw_basic .category_tab ul li.selected a {
color:#fff;
}
12zeo 님 고맙습니다. 덕분에 정렬이 잘 되었네요. ^^
근데, 분류탭 전체에 링크를 걸 수 있는 방법은 없을까요?
배추베이직 분류탭 출력 코드 소스 부분입니다.
-------------------------------------
<?
if ($is_category && $mw_basic[cf_category_tab]) {
$category_list = explode("|", $board[bo_category_list]);
?>
<div class="category_tab">
<ul>
<? if (!$mw_basic[cf_default_category]) { ?>
<li <? if (!$sca) echo "class='selected'";?>><div><a href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>">전체</a></div></li>
<? } ?>
<? for ($i=0, $m=sizeof($category_list); $i<$m; $i++) { ?>
<li <? if (urldecode($sca) == $category_list[$i]) echo "class='selected'";?>><div><a
href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>&sca=<?=urlencode($category_list[$i])?>"><?=$category_list[$i]?></a></div></li>
<? } ?>
</ul>
</div>
<? } ?>
근데, 분류탭 전체에 링크를 걸 수 있는 방법은 없을까요?
배추베이직 분류탭 출력 코드 소스 부분입니다.
-------------------------------------
<?
if ($is_category && $mw_basic[cf_category_tab]) {
$category_list = explode("|", $board[bo_category_list]);
?>
<div class="category_tab">
<ul>
<? if (!$mw_basic[cf_default_category]) { ?>
<li <? if (!$sca) echo "class='selected'";?>><div><a href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>">전체</a></div></li>
<? } ?>
<? for ($i=0, $m=sizeof($category_list); $i<$m; $i++) { ?>
<li <? if (urldecode($sca) == $category_list[$i]) echo "class='selected'";?>><div><a
href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$bo_table?>&sca=<?=urlencode($category_list[$i])?>"><?=$category_list[$i]?></a></div></li>
<? } ?>
</ul>
</div>
<? } ?>
게시글 목록
| 번호 | 제목 |
|---|---|
| 284348 | |
| 284336 | |
| 284333 | |
| 284332 | |
| 284320 | |
| 284318 | |
| 284316 | |
| 284313 | |
| 284307 | |
| 284306 | |
| 284303 | |
| 284298 | |
| 284296 | |
| 284290 | |
| 284286 | |
| 284280 | |
| 284277 | |
| 284272 | |
| 284261 | |
| 284259 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기