Tengo en 1 row 2 columnas, una es un menu arbol del lado izquierdo y un pdf del lado derecho.
menu izquierdo
<div id=myDIV>
<div class="container-fluid">
<div class="row " >
<div class="hidden-xs col-sm-3 col-lg-3 sidenav"
CONTENIDO
</div>
</div>
</div>
Y el div de la derecha:
<div class="hidden-xs col-sm-6 col-lg-9" align="center">
<embed src="aa.pdf" width="700px" height="500px" type="application/pdf">
es un PDF DE PRUEBA
</div>
Mediante jquery hice el boton que dice CLICK ME para que oculte el menu izquierdo y solo quede el PDF
$(document).ready(function(){
$('#todoen1').click(function(){ /*#todoen1 es el BOTON*/
$('#myDIV').fadeToggle('slow'); /*myDIV
});
});
El detalle está en que al ocultar el div izquierdo, el div derecho se mueve muy a la izquierda, NO queda centrado en medio de la pagina y es lo que estoy queriendo hacer.
Hay alguna manera de que al ocultar el DIV izquierdo el DIV derecho quede centrado? Justo en medio de la pagina
Utilizo bootstrap