최근게시물 땡겨 오니깐 div가 밀려서 나오는데요.. > 그누4 질문답변

그누4 질문답변

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

최근게시물 땡겨 오니깐 div가 밀려서 나오는데요.. 정보

최근게시물 땡겨 오니깐 div가 밀려서 나오는데요..

본문



최근게시물을 가져오기 전에는 거의 차이 없었거든요
FF와 IE의 원래 특유의 미세한 차이점 뿐이였는데

최근게시물 넣고 나니깐 저만큼 밀리네요..
FF에서는 원하는 레이아웃이 나오고요 IE에서는 저렇게 밀려서 나오는데
뭐가 문제인지 도저히 모르겠습니다..ㅠㅠ

제발 도와주세요..ㅠㅠ 혼자 공부하는데 물어 볼 사람이 없어요 ㅠㅠ

최근게시물 불러오는 소스는
아래 소스이고요,

<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
?>


<ul class="latest">
<? if (count($list) != 0) { ?>
<? for ($i=0; $i<count($list); $i++) { ?>


<?
if($i==0)

echo $list[$i]['icon_reply'] . " ";
echo "<a href='../love/bbs/board.php?bo_table={$bo_table}&wr_id={$list[$i][wr_id]}'>";
echo "<li>{$list[$i]['subject']}</li>";
echo "</a>";

?>


<? } ?>
<? } ?>
<? if (count($list) == 0) { ?>

게시물이 없습니다.
<? } ?>
</ul>

CSS

#box_latest .latest01{overflow:hidden;float: left; text-align:left; width:228px;}

#box_latest .latest02{overflow:hidden;float: left; text-align:left; width:227px;}

#box_latest .latest03{overflow:hidden;float: left; text-align:left; width:227px;}

#box_latest .latest04{float: left; text-align:left; width:228px;}

#box_latest .line {border-bottom:1px solid #e5e5e5;}


#latest_list01 {float: left; text-align:left; width:200px; margin-right:15px; padding:10px 0 0 13px; background-color:#cccccc;}
#latest_list01 .latest {float:left; list-style-type: none;}
#latest_list01 .latest li {color:#666666; padding:0 0 5px 8px; background: url(http://silverfang.zc.bz/img/latest_icon_arrow.gif) no-repeat 0 30%;}

#latest_list02 {float: left; text-align:left; width:200px; margin-right:14px; padding:10px 0 0 13px; background-color:#cccccc;}
#latest_list02 .latest {float:left; list-style-type: none;}
#latest_list02 .latest li {color:#666666; padding:0 0 5px 8px; background: url(http://silverfang.zc.bz/img/latest_icon_arrow.gif) no-repeat 0 30%;}

#latest_list03 {float: left; text-align:left; width:200px; margin-right:14px; padding:10px 0 0 13px; background-color:#cccccc;}
#latest_list03 .latest {float:left; list-style-type: none;}
#latest_list03 .latest li {color:#666666;padding:0 0 5px 8px; background: url(http://silverfang.zc.bz/img/latest_icon_arrow.gif) no-repeat 0 30%;}

#latest_list04 {float: left; text-align:left; width:200px; margin-right:15px; padding:10px 0 0 13px; background-color:#cccccc;}
#latest_list04 .latest {float:left; list-style-type: none;}
#latest_list04 .latest li {color:#666666; padding:0 0 5px 8px; background: url(http://silverfang.zc.bz/img/latest_icon_arrow.gif) no-repeat 0 30%;}

이렇게 되어 있습니다.

댓글 전체

익스플로러에서는 WIDTH값 적용이 200px 이 적용되어진것이고 파이어폭스에서는 WIDTH 값이 213으로 적용되어졌습니다. 실질적으로 적용된것은 파이어폭스가 맞습니다.

width: 200px; 에 padding: 10px 0 0 13px; 그러니까 padding-left: 13px이 존재하므로 200 + 13 = 213이 되므로 213이 맞는것입니다. 그부분을 찾아서 수정해보시는게

css 핵을 너무 많이 사용하시고 소스가 뒤죽박죽이어서 보기가 힘드네요!
그리고 CSS핵은 가급적 사용하지 않는게 좋습니다.
전체 66,554 |RSS
그누4 질문답변 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1402호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT