How to center two divs side by side into a container

PloMar
Posts: 48

How to center two divs side by side into a container

I have two DIVs inside a container. Like this:

Code: Select all

<div class="container"> <div id="dv1">Div 1</div> <div id="dv2">Div 2</div> </div>
I am trying to center the two divs, #dv1 and #dv2 side by side, inside the main container.
How to do that with css?

MarPlo
You can try the code from this example (using text-align: center; on .container, and display: inline-block; for children divs).

Code: Select all

<style> .container { position:relative; text-align:center; } #dv1, #dv2 { display:inline-block; width:30%; margin:0 4px; background:#33f; } </style> <div class="container"> <div id="dv1">Div 1</div> <div id="dv2">Div 2</div> </div>
Demo:
Div 1
Div 2

Similar Topics