Question

I have this program i am doing, and this includes css.

The thing I want help with you can find here: http://jsfiddle.net/yupsdk/6MxfQ/10/

body { margin: auto; }

#fields {
    position: relative; 
    width: 408px; 
    height: 370px; 
    background: url('http://hhsrv.n.dk/chat/gfx/rum/sms/old/gummicelle.jpg') repeat-x; border: 1px #DDD solid; 
}

.field {
    width: 2px;  
    height: 2px; 
    background: #FF0000; 
    position: absolute;
}

#user { 
    top: 500;   
    border: 1px solid black; 
    background: url('http://www.geekabit.dk/community/profil/figur/1335803573_149116.gif') no-repeat;  
    width: 52px; 
    height: 77px; 
}

When the script is loaded, the man need to stand on the number, like when it spawns it need to stand on 25, not under it like i does rigth now. If you have console in your browser, it will tell you what field it is soposed to stand on.

Can’t really figure it out. I have tried z-index and top, but it didn’t work. I hope you can help me out here.

Answer 1

I believe you want position:relative and z-index.

Number under shirt: http://jsfiddle.net/6MxfQ/17/

Number over shirt: http://jsfiddle.net/6MxfQ/16/

#user { border: 1px solid black;
   background: url('http://www.geekabit.dk/community/profil/figur/1335803573_149116.gif')
   no-repeat; width: 52px; height: 77px;
   position:relative;z-index:1;}