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

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

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

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

회원로그인

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