Here is a simple layout that I have: http://jsfiddle.net/656ckfyq/
<div class="container">
<div>
Some jumping content here
</div>
<div>
<a href="#" class="more">More</a>
</div>
</div>
And these are the styles for it:
.container {
display: table;
border: 1px silver solid;
}
.container div {
display: table-cell;
padding: 10px;
}
.more {
display: block;
border: 2px red solid;
margin-top: 20px;
}
The issue arises when trying to move only the link in the second cell down by 20px. Somehow, this also affects the content in the first cell.
What could be causing this behavior and how can it be fixed?