css 갤러리 최근글 불러올 때 가로갯수 문의드립니다. > 그누4 질문답변

그누4 질문답변

그누보드4 관련 질문은 QA 로 이전됩니다. QA 그누보드4 바로가기
기존 게시물은 열람만 가능합니다.

css 갤러리 최근글 불러올 때 가로갯수 문의드립니다. 정보

css 갤러리 최근글 불러올 때 가로갯수 문의드립니다.

본문

오류가 나는곳의 주소를 알려주시면 더 빠르고 정확하게 답변 받을 수 있습니다.

오류 주소 :

grapedw님께서 올려주신 최근글 소스로 갤러리 최신글로 변경하여 작업중에 있습니다.
소스대로 하면 한개씩 세로로 정렬이 주욱 되는데요
가로갯수를 4개씩 나오도록 정렬할 수 있을까요?

답변 부탁드리겠습니다.

<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
?>
<script src="<?=$latest_skin_path?>/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="<?=$latest_skin_path?>/jquery.quick.pagination.min.js"></script>
<!--<link rel="stylesheet" type="text/css" href="<?=$latest_skin_path?>/styles.css">-->
<style>
h1, h2,ul {
clear: both;
}

ul.pagination1 li:hover,
ul.pagination2 li:hover,
ul.pagination3 li:hover {
background-color: #ffffff;
}

ul.pagination1 li,
ul.pagination2 li,
ul.pagination3 li {
list-style-type:none;
 
    font-family: dotum;
background-color: #ffffff;
    font-size: 12px;
    color: #fff;
    line-height: 1;
    width: 600px;
    margin-bottom: 1px;
list-style:none;
border:1px solid #EFEFEF;
float: left;
margin:0px;
position:relative;
display:inline;
}

ul.red {
outline:10px solid red;
}

ul.simplePagerNav li{
    display:block;
    float: left;
    padding: 10px;
    margin-bottom: 10px;
    font-family: georgia;
font-size:14px;
border:1px solid #fde2ca
}

ul.simplePagerNav li a{
    color: #333;
    text-decoration: none;
}

li.currentPage {
background: red;
    background: #FF9500;
}

ul.simplePagerNav li.currentPage a {
color: #fff;
}

table.pageme {
    border-collapse: collapse;
    border: 1px solid #ccc;


table.pageme td {
    border-collapse: collapse;
    border: 1px solid #ccc;
}
</style>

<script type="text/javascript">
$(document).ready(function() {
$("ul.pagination1").quickPagination({pagerLocation:"both",pageSize:"12"});
});
</script>



 
<ul class="pagination1">
<? for ($i=0; $i<count($list); $i++) { ?>
<li>   
<?
$file = $list[$i][file][0][path] .'/'. $list[$i][file][0][file];
            echo $list[$i]['icon_reply'] . " ";
            echo "<a href='{$list[$i]['href']}'>";
echo "<img src='$file' width='185' border='0' height='135'>";
echo "<br />";
            if ($list[$i]['is_notice'])
                echo "<font style='font-family:돋움; font-size:9pt; color:#2C88B9;'><strong>{$list[$i]['subject']}</strong></font>";
            else
                echo "<font style='font-family:돋움; font-size:9pt; color:#6A6A6A;'>{$list[$i]['subject']}</font>";
            echo "</a>";

            if ($list[$i]['comment_cnt'])
                echo " <a href=\"{$list[$i]['comment_href']}\"><span style='font-family:돋움; font-size:8pt; color:#9A9A9A;'>{$list[$i]['comment_cnt']}</span></a>";

            // if ($list[$i]['link']['count']) { echo "[{$list[$i]['link']['count']}]"; }
            // if ($list[$i]['file']['count']) { echo "<{$list[$i]['file']['count']}>"; }

            echo " " . $list[$i]['icon_new'];
            echo " " . $list[$i]['icon_file'];
            echo " " . $list[$i]['icon_link'];
            echo " " . $list[$i]['icon_hot'];
            echo " " . $list[$i]['icon_secret'];
            ?>
</li>
<? } ?>
</ul>
  • 복사

댓글 전체

<ul class="pagination1">
 
<li>
<?
for ($i=0; $i<count($list); $i++) {

      $file = $list[$i][file][0][path] .'/'. $list[$i][file][0][file];
            echo $list[$i]['icon_reply'] . " ";
            echo "<a href='{$list[$i]['href']}'>";
            echo "<img src='$file' width='185' border='0' height='135'>";
            echo "<br />";

            if ($list[$i]['is_notice'])
                echo "<font style='font-family:돋움; font-size:9pt; color:#2C88B9;'><strong>{$list[$i]['subject']}</strong></font>";
            else
                echo "<font style='font-family:돋움; font-size:9pt; color:#6A6A6A;'>{$list[$i]['subject']}</font>";
            echo "</a>";

            if ($list[$i]['comment_cnt'])
                echo " <a href="{$list[$i]['comment_href']}"><span style='font-family:돋움; font-size:8pt; color:#9A9A9A;'>{$list[$i]['comment_cnt']}</span></a>";

            // if ($list[$i]['link']['count']) { echo "[{$list[$i]['link']['count']}]"; }
            // if ($list[$i]['file']['count']) { echo "<{$list[$i]['file']['count']}>"; }

            echo " " . $list[$i]['icon_new'];
            echo " " . $list[$i]['icon_file'];
            echo " " . $list[$i]['icon_link'];
            echo " " . $list[$i]['icon_hot'];
            echo " " . $list[$i]['icon_secret'];
    if($i%4 == 0)
            echo "</li><li>";
}
?>
</ul>

그리고 css나 style로 이미지 사이즈 맞춰주세요.
ul.pagination1 li,
ul.pagination2 li,
ul.pagination3 li {
list-style-type:none;
 
    font-family: dotum;
background-color: #ffffff;
    font-size: 12px;
    color: #fff;
    line-height: 1;
    width: 600px;
    margin-bottom: 1px;
list-style:none;
border:1px solid #EFEFEF;
float: left;
margin:0px;
position:relative;
display:inline;
}
위에서 width:600px 를 현재 전체 가로에 나누기 4 하셔서 입력하시고요 만약 전체가 800이시면 200px 로 잡아주시면 되는데 혹 border 문제로 190px 로 잡아 주시면 됩니다
© SIRSOFT
현재 페이지 제일 처음으로