Force element to move up - html

Question

I have a box that is rendering lower and I cant figure out why.
<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"> </div>
<div class="linetwo"> </div>
<div class="linetwo"> </div>
</div>
</div>
<div class="boxes">
<div class="left">
</div>
<div class="right">
</div>
</div>
</div>
#endif
</div>
No matter what I do it wont budge.
.privatecard {
margin-top: -500px !important;
}
.privatecard {
padding-bottom: 500px !important;
}
//etc
How can I force it to move up?

Answer 1

Post a fiddle?
I've had this issue in the past though, and I've resolved it by a combination of making sure all inline-block elements are also vertical-align:top; (or any other state, as long as it's all consistent). AND then, set a min-height to the parent container, and a min-height to all the inline-block'd elements