HTML+CSS+JavaScript

Здравствуйте Уважаемое сообщество.
У меня есть свёрстанный макет.
http://www.my-page30.narod.ru
Есть некоторые вопросы.

1) С правой стороны есть рисунок кнопки "Заказать звонок менеджеру", стили для рисунка

body {     font: 12px/18px Arial, Tahoma, Verdana, sans-serif;     width: 100%;     height: 100%;     background:url(../image/zakaz.gif) #173653 no-repeat; background-position:100% 102px;    }

Как сделать чтобы это изображение было на переднем плане, сейчас при разрешении 1024 на 768, часть рисунка срезается содержимым страницы, пробовал z-index:2 не помогло.

2) В верхней части страницы, с левой стороны есть рисунки ссылок - домой, поиск, написать письмо. Ссылки сделаны в виде горизонтального списка в блоке baners
html

<div id="baners">             <ul>                 <li><a href=""><img src="image/home.jpg" width="25" height="25" alt="Домой" /></a></li>                 <li><a href=""><img src="image/search.jpg" width="25" height="25" alt="Найти" /></a></li>                 <li style="border:none; "><a href=""><img src="image/mail.jpg" width="25" height="25" alt="Написать письмо" /></a></li>             </ul>         </div>

css

#baners { margin:70px 0px 0px 5px; padding:0px; width:30px; height:93px; float:left;  } #baners ul { list-style:none;  } #baners ul li { border-bottom:1px dotted #d3d3d3; text-align:center; height:34px; margin:0px; padding:10px 0px 0px 0px; }

Блок baners перекрывается блоком duga,
Не могу сделать чтобы ссылки были на переднем плане, опять же пробовал z-index:3 не помогло

3) Есть ещё вопрос по footer, почему то в Mozile футер сместился.
html

<div id="footer">    <div id="footer_div">      <div id="f_left">                 <div class="text_tel1">наши телефоны:             </div>             <div class="text_tel2">8 (495)              </div>             <div class="text_tel3">&nbsp;361-98-78</div>             <div class="text_tel2">8 (916)              </div>             <div class="text_tel3">&nbsp;605-33-09</div>      </div>      <div id="f_center">Copiright &copy; Лидер XXI век - Автосервисное оборудование 2009 - Все права зашищены.</div>      <div id="f_right">          <a href=""><img src="image/baner_footer.jpg" width="88" height="31" class="img_f_right" alt="Статистика посещений" /></a>      </div>   </div>  </div>

css

#footer_div { width:950px; height:100px; margin:0px; padding:0px; vertical-align:middle;  text-align:center; background:url(../image/right_niz_ugol.jpg) no-repeat right bottom #FFFFFF;  }  #f_left { float:left; margin:0px; padding:12px 0px 0px 0px; text-align:left; width:230px;}  #f_center { float:left; margin:0px; padding:12px 10px 0px 15px; }  #f_right { float:right; margin:23px 15px 0px 0px; padding:0px; background:url(../image/footer_right.jpg) no-repeat left bottom; width:168px; height:75px;  }  .img_f_right { margin:5px 0px 0px 50px; padding:0px;  }

Ни поможете, что сделать можно.

1) вместо фоновой картинки сделать блок с абсолютным позиционированием

<div style="position:absolute;top:100px;right:0; width:25px;height:100px;background:red">**</div>

2) если вы выведите ссылки на передний план, они перекроют дугу. вам эту дугу необходимо не картинкой сделать, а разрезать на части и поставить как фон соответствующим блокам

1) По кнопке заказать звонок менеджеру нормально.

2) А без разрезания дуги на части обойтись можно?
http://www.my-page30.narod.ru
Блок с дугой обведён.

3) Что можно с футером сделать, почему в mozila он смещается
css

#footer {     width: 950px;      margin: -125px 25px 25px 25px;      height: 100px;     background: #FFFFFF; }

Вроде и код по footer правильный, в ie 7, opera 9, safari всё нормально, в mozila он смещается, почему не пойму?

Сделал рисунок дуги фоном, как добится того чтобы ссылки рисунков, домой, поиск, написать письмо были активными.
http://www.my-page30.narod.ru
Для дуги
html

<div id="duga">             <!-- <img src="image/duga.gif" width="100" height="288" alt="" />-->         </div>

css

#duga { width:100px; height:288px; position:relative; left:-286px; top:-2px; margin:0px; padding:0px; float:left; border:1px solid black; background:url(../image/duga.gif) no-repeat left top; z-index:1  }

для рисунков списка
html

<div id="baners">             <ul>                 <li><a href=""><img src="image/home.jpg" width="25" height="25" alt="Домой" /></a></li>                 <li><a href=""><img src="image/search.jpg" width="25" height="25" alt="Найти" /></a></li>                 <li style="border:none; "><a href=""><img src="image/mail.jpg" width="25" height="25" alt="Написать письмо" /></a></li>             </ul>         </div> <!-- #baners -->

css

#baners { margin:70px 0px 0px 5px; padding:0px; width:30px; height:140px; float:left; z-index:5; border:1px solid black;  } #baners ul { list-style:none; z-index:5  } #baners ul li { border-bottom:1px dotted #d3d3d3; text-align:center; height:34px; margin:0px; padding:10px 0px 0px 0px; z-index:5 }

Что ещё можно сделать, хотел чтобы ссылки домой, поиск, написать письмо были активными.