1. Suponiendo que tendras 3 <div> : derecha, centro (tu pagina) e izquierda
2. el <div> 'centro' como tiene width ... le ponemos el id #centro y en css: margin 0 auto y lo tendremos centrado ...
<div id="centro"></div>
#centro {
margin: 0 auto;
}
Ver el archivo adjunto 1017062
3. Agregamos los otros 2 <div> uno arriba y otro abajo de 'centro'...
<div id="izquierda"></div>
<div id="centro"></div>
<div id="derecha"></div>
Ver el archivo adjunto 1017065
4. Despues los 3 <div> los metemos dentro de otro, le llamaremos 'cont' y le agregamos css: display: flex con ese se alinearan horizontalmente ...
#cont {
display: flex;
}
<div id="cont">
<div id="izquierda"></div>
<div id="centro"></div>
<div id="derecha"></div>
</div>
Ver el archivo adjunto 1017066
5. Y ya. Dentro de los <div> derecha e izquierda metes el codigo ads
En resumen metes los 3 divs dentro de otro div y a este le pones display: flex
<div id="cont">
<div id="izquierda"></div>
<div id="centro"></div>
<div id="derecha"></div>
</div>
#centro {
width: 200px;
background: #ccc;
height: 100px;
margin: 0 auto;
}
#izquierda {
width: 100px;
height: 100px;
border: 1px solid #dbdbdb;
}
#derecha {
width: 100px;
height: 100px;
border: 1px solid #dbdbdb;
}
#cont {
display: flex;
}