Good evening everyone! There is inside the block id="content" - Block slide show and in it the navigator

  <div id="wrapper"> <!-- ширина 980 margin: auto; --> <div id="content"> <!-- ширина 780 float:left; 200 для rightBar--> <!-- --------------------------------------------------------------------- --> <div id="slider"> <!-- Слайдшоу (Ротатор контента) ширина 740, padding:20px; --> <div class="image"> <img src="1.jpg"/> <p></p> </div> <div class="image"> <img src="2.jpg"/> <p></p> </div> <div class="image"> <img src="....jpg"/> <p></p> </div> <div class="nav"> <!-- Навигация --> <a href="#">1</a> <a href="#">2</a> <a href="#">...</a> </div> </div> <!-- ------------End Слайдшоу (Ротатор контента)---------------------------- --> </div> </div> 

I just can not make the navigator in the center of the rotator, try position: absolute; left:50%; position: absolute; left:50%; (by the way, width not a constant, it depends on the number of pictures in the rotator), it turns out in the center of the screen and not of the rotator, how to do it not from the screen but what came out of the width of the rotator?

  • #content {position: relative;} ? - zb '
  • Not - this is not that, because there is a hover: when you make navigation appear, and when you remove it disappears and that if the relative is done, then the whole block will move up and down. It seems to have to do with JS - bemulima
  • neponyal as connected with hover - zb '
  • class = "nav" a separate separate block is obtained and when you draw a block = = a nav = block appears and all lower blocks move down for example 20px, just when you remove the entire lower block back into place and every time so - bemulima
  • jsfiddle do, I do not understand what the problem is - zb '18