html - Center a stack of div's CSS -



html - Center a stack of div's CSS -

i trying stack div on top of div , center 2 divs horizontally in page.

class="lang-css prettyprint-override">.sandbox{ position:relative; } .product-image, .option-image{ position:absolute; margin-left:auto; margin-right:auto; } .product-image{ z-index:-1; } class="lang-html prettyprint-override"><div class="sandbox"> <div class="product-image"> <img src="main-product-image.jpg" width="1440" height="560" alt=""/> </div> <div class="option-image"> <img src="overlay.png" width="1440" height="560" alt=""/> </div> </div>

this stack part works fine can not seem them centered no mater try.

this should create them centered.

.product-image, .option-image{ position:absolute; margin-left:auto; margin-right:auto; left: 0; /*new*/ right: 0; /*new*/ }

demo: http://jsfiddle.net/hno8bxty/

html css centering

Comments

Popular posts from this blog

java - How to set log4j.defaultInitOverride property to false in jboss server 6 -

c - GStreamer 1.0 1.4.5 RTSP Example Server sends 503 Service unavailable -

Using ajax with sonata admin list view pagination -