i want to center some inline-block divs.
I want to create a responsive design, so if the screen
size is too small,
the horizontal elements should be under each other.
How can i center them vertical, so they are side by side without a difference in height?
(See fiddle).
Moveover those elements should be verticaly centered, if the screen
size is too small.
http://jsfiddle.net/5dpRs/52/
CSS
.repeat
{
display:inline-block;
border-style:solid;
border-width:2px;
height:50px;
width:50px;
}
#content
{
border-style:solid;
border-width:2px;
text-align:center;
}
HTML
<div id="content">
<div class="repeat">
<p>hello</p>
</div>
<div class="repeat">
</div>
</div>
Thank you :)
