Css question

I got my slider working:

http://www.orangestonephotography.com/test/nonworking/

But as you can see its not working properly, the slider buttons should be on the image itself like here:

http://www.orangestonephotography.com/test/jun/

But i need the slider to be centered. I know that the piece of code I am having trouble with is:

#slidesitems { 
	  position:absolute;
	top:60px;
	right:0;
	z-index:20; }

I tried removing position: absolute; but that doesn’t fix the problem. Can anyone please help?

Here is my whole css:

http://silver163.pastebin.com/m566f8101

and html:

http://silver163.pastebin.com/m7018290f

please help!

Give the #slides div a position of relative.


#slides {
  width:950px;
  height:429px;
  top:0;
  left:0;
  background:#ccc;
  z-index:5;
  position:relative;
}

so?

position: choice; top: 0px; bottom: 0px; left: 0px; right: 0px;

?

So, I was trying to help. :rolleyes:

position:relative; has no (top left bottom right) choices it tells the absolutely positioned elements within it to position itself absolutely, relative to itself. That should have been enough to fix it. It worked for me using Firebug anyway.

i really didn’t mean it to come out that way. i mean so… i do this? but i did what you said and if you click that same link again hte links have moved below. not sure how i position them over the image stiill.

Change the #slideitems back to position:absolute; and add position:relative; to the #slides selector.

#slides{
  width:950px;
  height:429px;
  background:#ccc;
  z-index:5;
  position:relative;
}
#slidesitems{ 
  position:absolute;
  top:60px;
  right:0;
  z-index:20;
}

Hope it helps. :slight_smile:

omg yes! finally i was going nuts trying to fix this thing. damn back to w3c schools for me then :X

i have the same doubts, now its cleared