빈공간이 왜 생기는지 이유를 모르겠어요

빈공간이 왜 생기는지 이유를 모르겠어요

QA

빈공간이 왜 생기는지 이유를 모르겠어요

본문

991939767_1605006843.558.png

사진에 빨간 네모박스를 보시면 영문 모르게 팔로우 순위 왼쪽이 비어있습니다.. 왜일까요?

 

코드 남깁니다.

 


<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가 
?>
<div class="col-md-6">
  <!-- 보유포인트 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 보유포인트 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'now_point', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 보유포인트 순위 끝 -->
</div>
<div class="col-md-6">
  <!-- 적립포인트 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 적립포인트 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'max_point', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 적립포인트 순위 끝 -->
</div>
<div class="col-md-6">
  <!-- 사용포인트 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 사용포인트 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'use_point', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 사용포인트 순위 끝 -->
</div>
<div class="col-md-6">
  <!-- 레벨 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 레벨 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'level', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 레벨 순위 끝 -->
</div>
<div class="col-md-6">
  <!-- 팔로우 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 팔로우 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'fallow', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 팔로우 순위 끝 -->
</div>
<div class="col-md-6">
  <!-- 좋아요 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 좋아요 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'like', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 좋아요 순위 끝 -->
</div>
<div class="col-md-6">
  <!-- 글등록 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 글등록 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'post', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 글등록 순위 끝 -->
</div>
<div class="col-md-6">
  <!-- 댓글등록 순위 시작 -->
  <div class="div-title-underbar">
    <span class="div-title-underbar-bold border-<?php echo $line;?> <?php echo $font;?>">
      <strong style="color:#000;"><img src="../img/point_icon.png" alt=""/> 댓글등록 순위</strong>
    </span>
  </div>
  <div class="widget-box">
    <?php echo apms_widget('basic-member', $wid.'comment', 'cnt=1 rank=navy ex_grade=10'); ?>
  </div>
  <!-- 댓글등록 순위 끝 -->
</div>

이 질문에 댓글 쓰기 :

답변 2

각 영역 DIV 의 높이가 완전히 동일할 때 해당문제가 발생하지 않습니다.

(각 영역 DIV 의 높이가 미세하게라도 다를 때 해당문제가 발생합니다.)

 

순위 아이디에 아이콘 이미지가 있는 경우와 없는 경우 등 때문에.. 미세하게 높이가 다른 듯 싶습니다.

* 포인트 순위 DIV 높이 : 285px

* 레벨 순위 DIV 높이 : 283px

 

높이를 동일하게 맞추는 방법으로 다음의 방법을 사용해 볼 수 있을 듯 합니다.. ( /thema/Basic/widget/basic-member/widget.css )

.widget-basic-member-list li {margin:0;padding:0px;height: 25px;}

css로 해당 최근 게시물 노출되어지는 부분의 공간이나 틀에 대한 문제로 여백 부분의 공간으로 인해 밀려서 해당 부분이 공백 공간으로 처리되는듯 한데요

답변을 작성하시기 전에 로그인 해주세요.
전체 123,726 | RSS
QA 내용 검색

회원로그인

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