div superpuesto con el índice z

i'm stuck in a bit of a rut at the moment.

if you head over to my website...


You will see an image, and a div underneath it. I have spent the past few hours trying to position these both in the middle of the page, with the bottom div over lapping the image.

I have failed and failed, what am I doing wrong here? I have used z-index, and positioning but its never centered.


preguntado el 28 de agosto de 11 a las 04:08

Have you tried absolute positioning the div that should come to front? -

3 Respuestas

Wow, that's alot of code going on for that page.

Without reviewing everything yet (will in a bit) - have you tried setting the main image to be a background image of a div, and then simply putting the log in form inside it?


#image-div { background-image:url('yourimage.jpg'); }


<div id="image-div">
    <div id="form-div">

Respondido 28 ago 11, 08:08

Lets say one div has width w1 and height h1 ; other w2 , h2

#div1 {
   position:absolute; top:50%; left:50%; margin-left: - w1/2px; margin-top:-h1/2px;

#div2 {
   position:absolute; top:50%; left:50%; margin-left: - w2/2px; 
   margin-top:-h2/2px; z-index:9999;

Respondido 28 ago 11, 08:08

Todo lo que necesitas es esto:


#my_img {

#my_div {


<img id="my_img" src="http://dekkro.no-ip.org/images/testimage.png" />
<div id="my_div">whatever</div>

Aquí hay una demostración: http://jsfiddle.net/tX2JY/embedded/result/

Respondido 28 ago 11, 08:08

OF COURSE! i'm such an idiot. thanks dude, my excuse is it's 5:46am. thanks! - dekkytsh

is there any way to make it stay dead center while re-sizing the page? - dekkytsh

Depending on the window resolution, it isn't looking centered to me. - Paul Sham

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.