Проблема с ссылками

[immortal2305]

Здравствуйте. У меня такая проблема - мне нужно разместить 4 кнопки на шапке сайта.

В ксс прописал:

#but1 {
         position: absolute;
  height: 31px;
         width: 108px;
         display:block;
         padding-top: 346px;
         padding-left: 346px;
}

#but2 {
         position: absolute;
  height: 31px;
         width: 108px;
         display:block;
         padding-top: 346px;
         padding-left: 505px;
}

#but3 {
         position: absolute;
  height: 31px;
         width: 108px;
         display:block;
         padding-top: 346px;
         padding-left: 660px;
}
#but4 {
         position: absolute;
  height: 31px;
         width: 108px;
         display:block;
         padding-top: 346px;
         padding-left: 850px;
}

В нтмл:

<div id="but1">
картинка с ссылкой
  </div>
  <div id="but2">
картинка с ссылкой
  </div>
  <div id="but3">
картинка с ссылкой
  </div>
  <div id="but4">
картинка с ссылкой
  </div> 

Проблема в том, что нажимается только последняя кнопка, первые 3 - просто картинки, нельзя на них нажать, прошу кто может, помочь мне разобраться.

Edited September 28, 2011 by immortal2305

[Svatov]

Кинь нормальный код, с того что ты предоставил мне не понятно, что ты подразумеваешь под картинка с ссылкой. И да зачем прописывать display:block и так блочному элементу div. Думаю ты что-то перепутал и нам не то показал. И то что у тебя нажимается только последняя нет ничего удивительного ведь ты position:absolute вытянул из потока эти элементы и превратил их в стек в котором функционирует только последний..поскольку он находится последним...как четыре игральные карты наложить друг на друга...трудно предположить что вы добиваетесь сделать, но уверен вам нужно почитать на этом форуме про свойство position и как его использовать.

Edited September 28, 2011 by Svatov

[immortal2305]

Да, я понимаю, что проблема в этом свойстве.

 <div id="but1">
 <a href="/mody/0-24" target="_blank"><img src="/diz_n/shapa/shapa2/but_mods.png" border="0"></a>
 </div>
 <div id="but2">
 <a href="/patchi/0-32" target="_blank"><img src="/diz_n/shapa/shapa2/but_patch.png" border="0"></a>
 </div>
 <div id="but3">
 <a href="/knigi/0-34" target="_blank"><img src="/diz_n/shapa/shapa2/but_books.png" border="0"></a>
 </div>
 <div id="but4">
 <a href="/onlajn_video/6" target="_blank"><img src="/diz_n/shapa/shapa2/but_video.png" border="0"></a>
 </div> 

Я добиваюсь, чтобы 4 кнопки располагались на одной линии, на шапке. И тогда мне не понятно, какое свойство использовать.

Сам сайт

Если например использовать position: relative или вообще не писать свойство position, то они как лестницей отображаются.

[zSpx]

Позиционировать нужно не padding'ом, а top:x и left:x. Можете фон div'у задать, тогда поймете, почему кнопки не нажимаются. Вы, как уже Svatov написал, просто перекрыли последним div'ом 3 предыдущих.

[immortal2305]

Почему кнопки не нажимаются - с этим конечно всё понятно. Но обычные top:30px; left:600px; эффекта никакого не оказывают? как правильно их задать?

[zSpx]

c position: absolute разумеется.

[immortal2305]

Точно, благодарю. Разобрался наконец. Спасибо.