Beste SD'ers,

elke keer heb ik wel iets dat niet lukt bij jQuery scripts..
Deze keer zijn het mijn arrows die ik maar niet goed gepositioneerd krijg.. (zie bijlage)

#slider{
background:#FFF;
position:absolute;
}

#slider img{
border:0;
}

#slider ul, #slider li{
margin:0;
padding:0;
list-style:none;
}
#slider li{
width:230px;
height:115px;
overflow:hidden;
}
#prevBtn, #nextBtn{
display:block;
width:16px;
height:17px;
position:relative;
left:0px;
top:0px;
}
#nextBtn{
left:230px;
}
#prevBtn a, #nextBtn a{
display:block;
width:16px;
height:17px;
background:url(images/btn_prev.gif) no-repeat 0 0;
}
#nextBtn a{
background:url(images/btn_next.gif) no-repeat 0 0;
}

Grappig, ik heb precies dezelfde slider gebruikt.

Ik zal wat css posten, maar weet niet of het de remedie is die je zoekt.

#featured is container voor de slider

Code:

#featured
{
  margin   : 0;
  padding : 40px 0;
  height   : 247px;
}

// bevat IE 6, 7 fix, ws niet van toepassing voor u
#slider li 
{ 
  margin     : 0 0 0 22px !important;
  padding    : 0 !important;
  margin     : 0;
  padding    : 0 0 0 22px;

  width      : 910px;
  height     : 247px;
}	

#nextBtn
{ 
  margin: -185px 0 0 0;
  float: right;
}

#prevBtn
{ 
  margin: -185px 0 0 0;
  float : left;
}
														
#prevBtn a, #nextBtn a
{  
  display :block;
  width   :18px;
  height  :80px;
}

Kortom wat ik doe is de margin-top : -185px (helf van het plaatje)

Dus succes.

Fabien,

ik weet hoe ik mijn pijltjes mooi in het midden kan zetten, maar je ziet zelf dat ze niet mooi naast elkaar staan.. Das het probleem hé :p
Toch bedankt ;)

Het is dus niet helemaal gelukt begrijp ik, het is nu wat minder warm dus ik kan nog wel even wat typen.

Wat er misschien nog mis kan gaan is dat je stylesheet onder het #slider stuk nog een algemene a { margin / padding / position } of iets dergelijkts uitvoert. Misschien niet hoor, maar soms doe ik dat en dan baal ik flink tijdens het terugzoeken.

Wat er anders misschien mis kan gaan is dat een element dat de elementen #prevBtn, #nextBtn wel relatief gepositioneerd zijn, maar de #slider li niet, die is in principe geen block element, dus wat er precies misgaat durf ik niet te zeggen, maar misschien als je meegeeft

#slider li { position: relative; .....css...} dat het dan goed gaat.

Anders zou ik even proberen alles te gaan doen met float: left;

Lukt dat allemaal niet dan hoop ik voor je dat er nog een CSS god binnenstormt :D

Lost het probleem jammer genoeg niet op..

hoe moet het er wel uit komen te zien dan?
En hoe is je html opgebouwd?
Voorbeeld pagina?