2016-01-20 83 views
0

我有一个渲染较低的方块,我无法弄清楚为什么。强制元素向上移动

enter image description here

<div id="hint-history" class="popup"> 
<div class="row"> 
    <div class="col" id="closehistorypopup"> 

     <div class="body"> 

      <button class="x"> 
       <span class="sprite close"></span> 
      </button> 

      <div class="title">Hint History</div> 

      <div class="lists"> 
       <?php for($i=0;$i<6;$i++) { ?> 
        <div class="list history[[$i]]" id="history[[$i]]"> 
         <div class="info"> 
          <div class="picture monophoto"> 
           <div class="text">BO</div> 
           <div class="img" style="background-image: url();"></div> 
          </div> 
          <div class="right"> 
           <div class="lineone">John Smith</div> 
           <div class="linetwo">Daily Essentials</div> 
          </div> 
         </div> 
         <div class="boxes"> 
          <div class="left"> 
           <div class="box box1"></div> 
          </div> 
          <div class="right"> 
           <div class="box box2"></div> 
           <div class="box box3"></div> 
          </div> 
         </div> 
         <a class="cbutton whiteonblack">VIEW LIST<!--SEE <span class="owner">JOHN'S</span>--></a> 
        </div> 
       <?php } ?> 
       <?php $i++; $privateCount = 1; ?> 
       @if ($privateCount > 0) 
        <div id="privatecard" class="list history[[$i]]"> 
         <div class="info"> 
          <div class="picture monophoto" style="visibility: hidden;"> 
          </div> 
          <div class="right"> 
           <p id="privatecounter">       
            @if ($privateCount == 1) 
             There is [[$privateCount]] private user. 
            @else 
             There are [[$privateCount]] private users. 
            @endif 
           </p> 
           <div class="linetwo">&nbsp;</div> 
           <div class="linetwo">&nbsp;</div> 
           <div class="linetwo">&nbsp;</div> 
          </div> 
         </div> 
         <div class="boxes"> 
          <div class="left"> 
          </div> 
          <div class="right"> 
          </div> 
         </div> 
        </div> 
       @endif 
      </div> 

不管我做什么,它不会让步。

.privatecard { 
    margin-top: -500px !important; 
} 
.privatecard { 
    padding-bottom: 500px !important; 
} 

//etc 

我该如何强制它向上移动?

+0

请问您是否可以为相关元素包含所有相关的CSS?不仅仅是你尝试过的CSS。 – zgood

回答

1

发表小提琴?

虽然我曾经遇到过这个问题,但我已经通过确保所有inline-block元素也是vertical-align:top;(或任何其他状态,只要它们都一致)的组合来解决它。然后,将min-height设置为父容器,并将min-height设置为所有inline-block'd元素