최신글 옆으로 노출 채택완료

 

최신글이 노출될때 아래 그림 처럼 오른쪽에 이어서 노출 되는 형태로 하려면 어케 해야하나요?

고수님들께 여쭙니다.ㅜㅜ

 

6057fb0eff85be186fc62a5824e83b96_1435052894_8035.gif
 

 

 

Copy
<style>.tab_list{height:180px; }.tab_list ul{position:relative;margin:0;padding:0;border-bottom:1px solid #ccc;font-family:Tahoma, Sans-serif;font-size:12px;list-style:none;*zoom:1}.tab_list ul:after{display:block;clear:both;content:""}.tab_list li{float:left;margin-bottom:-1px}.tab_list li a{float:left;position:relative;border:1px solid #eee;border-bottom-color:#ccc;background:#fafafa;color:#666;text-decoration:none}.tab_list li a span{display:inline-block;padding:6px 25px 6px 25px;letter-spacing:-1px;cursor:pointer}.tab_list li ul{display:none;position:absolute;top:40px;left:0;width:100%;margin:0;padding:0;border:0;list-style:none;*zoom:1}.tab_list li ul:after{display:block;clear:both;content:""}.tab_list li li{float:none;position:relative;margin:0 0 8px 8px;color:#999}.tab_list li li a{float:none;margin:0;padding:0;border:0 !important;background:transparent;font-weight:normal;color:#333 !important;letter-spacing:normal;}.tab_list li li a:hover,.tab_list li li a:active,.tab_list li li a:focus{color:#000 !important;text-decoration:none;}.tab_list li li a.board{float:none;margin:0;padding:0;border:0 !important;background:transparent;font-size:11px;font-weight:normal;color:#999 !important;letter-spacing:normal;}.tab_list li li a.board:hover,.tab_list li li a.board:active,.tab_list li li a.board:focus{color:#666 !important;text-decoration:none}.tab_list li li a.commnet{float:none;margin:0;padding:0;border:0 !important;background:transparent;font-size:10px;font-weight:normal;color:#666 !important;letter-spacing:normal}.tab_list li li a.commnet:hover,.tab_list li li a.commnet:active,.tab_list li li a.commnet:focus{color:#666 !important;text-decoration:underline}.tab_list li li.more{font-family:돋움;font-size:11px;position:absolute;top:-50px;right:15px;border:0 !important;background:transparent}.tab_list li li span.datetime{font-family:돋움;font-size:11px;position:absolute;top:0px;right:0;border:0 !important;background:transparent}.tab_list.m1 .m1 a,.tab_list.m2 .m2 a,.tab_list.m3 .m3 a,.tab_list.m4 .m4 a,.tab_list.m5 .m5 a, .tab_list.m6 .m6 a,.tab_list.m7 .m7 a, .tab_list.m8 .m8 a {margin-top:-1px;border:1px solid #ccc;border-bottom:1px solid #fff;background:transparent;color:#333}.tab_list.m1 .m1 a span,.tab_list.m2 .m2 a span,.tab_list.m3 .m3 a span,.tab_list.m4 .m4 a span,.tab_list.m5 .m5 a span,.tab_list.m6 .m6 a span,.tab_list.m7 .m7 a span,.tab_list.m8 .m8 a span{padding-top:7px;font-weight:bold}.tab_list.m1 .m1 ul,.tab_list.m2 .m2 ul,.tab_list.m3 .m3 ul,.tab_list.m4 .m4 ul,.tab_list.m5 .m5 ul,.tab_list.m6 .m6 ul,.tab_list.m7 .m7 ul,.tab_list.m8 .m8 ul{display:block}.tab_list.js_off{height:auto}.tab_list.js_off ul{border:0}.tab_list.js_off li{float:none;position:relative}.tab_list.js_off li a{display:block;float:none;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important;font-weight:bold;color:#333}.tab_list.js_off li ul{position:static;display:block;left:0;top:0;padding:5px 0}.tab_list.js_off li li a{display:inline;border:0 !important;background:none !important;font-weight:normal}.tab_list.js_off li li .more{top:5px;right:15px;}</style><div style="height:106px;" class="tab_list m1" ><ul><? for($m=0; $m<count($gr_id); $m++) { $num = $m+1;  ?><li class="m<?=$num?>"><a href="#" jquery16408452460570924265="<?=$num?>"><span ><?=$gr[$m][gr_subject]?></span></a> <ul style="margin:15px 0 0 15px;" ><?$empty_row = $rows - count($list[$m]);for($n=0; $n<count($list[$m]); $n++) {  echo "<li>";  echo "<a class=\"board\" href=\"{$g4[bbs_path]}/board.php?bo_table={$list[$m][$n][bo_table]}\">[{$list[$m][$n][bo_subject]}] </a>";  echo "<a href=\"{$list[$m][$n]['href']}\">{$list[$m][$n][subject]}</a>";  if ($list[$m][$n]['comment_cnt'])   echo " <a class=\"commnet\" href=\"{$list[$m][$n]['comment_href']}\">{$list[$m][$n]['comment_cnt']}</a>";  echo "<span style='margin-right:10px;' class=\"datetime\">{$list[$m][$n][datetime2]}</span>";  /* 아이콘 사용시 본 주석을 삭제하고, 활성화 시켜주세요.  echo " " . $list[$m][$n]['icon_new'];  echo " " . $list[$m][$n]['icon_file'];  echo " " . $list[$m][$n]['icon_link'];  echo " " . $list[$m][$n]['icon_hot'];  echo " " . $list[$m][$n]['icon_secret'];    */  echo "</li>";  }for($l=0; $l<$empty_row; $l++) {  echo "<li> <a href='#'>".$gr[$m][gr_subject]."탭의 최신글이 더 없습니다.</a></li>";}?><li class="more"> <a href="#">more</a></li></ul></li><? } ?></ul></div><script type="text/javascript">jQuery(function($){	var tab = $('.tab_list');	tab.removeClass('js_off');	tab.css('height', tab.find('>ul>li>ul:visible').height()+40);	function onSelectTab(){		var t = $(this);		var myClass = t.parent('li').attr('class');		t.parents('.tab_list:first').attr('class', 'tab_list '+myClass);		tab.css('height', t.next('ul').height()+40);	}	tab.find('>ul>li>a').click(onSelectTab).focus(onSelectTab);});</script>

답변 1개

채택된 답변
+20 포인트

http://sir.co.kr/g5_skin/3873

이거 참고해 보세요. 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고