<div>
<div class="inline-block"></div>
<div class="inline-block relative"></div>
<div class="inline-block"></div>
<div class="inline-block"></div>
</div>
<br />
<div>
<div class="inline-block"></div>
<div class="inline-block relative shifted"></div>
<div class="inline-block"></div>
<div class="inline-block"></div>
</div>
body {
background: #282828;
}
.inline-block {
display: inline-block;
margin-right: 15px;
background: #ffffff;
width: 40px;
height:40px;
}
.relative {
position: relative;
}
.shifted {
top: 30px;
bottom: 1000px;
left: 15px;
right: 200px;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.