выравнивание абсолютно позиционированного блока по центру

[fiver]

Здравствуйте!

Есть логотип, размером 300 на 100, неровной формы gif без фона, который должен размещаться по верх верстки шапки ровно по центру страницы.

Я его разместил следующим образом:

<div class='logo'><a href='#'><img src='/img/logo.gif'></a>
div.logo {position: absolute; top: 12px; width: 100%; text-align: center;}

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

В IE ссылки работают, а вот в хроме и мазиле нет, т.к. оказались под слоем.

Как сделать слой шириной не 100% а 300px и разместить его по центру.

В идеале параметр left: 50% - 150px

Либо вообще нет параметра left, но див сам оказывается по центру страницы.

Либо что то сделать с ссылками. что бы они работали.

В общем буду рад любому конструктивному совету.

Кроме порезать лого на части и таким макаром вписать его в нужный макет.

[Avalon4eg]

z-index-ом вывести их поверх слоя с логотипом - если это не испортит общую картину

[fiver]

z-index-ом вывести их поверх слоя с логотипом - если это не испортит общую картину

Т.е. меню поместить в div и задать максимальный z-index ?

Сейчас попробую, спасибо за совет!

[Bonzash]

Делайте left: 50%; и добавьте z-index.

[fiver]

Делайте left: 50%; и добавьте z-index.

left: 50% размещает по центру левый край логотипа. А сам лого смещается от центра на половину своей ширины, т.е 150 пикс. что очень заметно даже на большом мониторе.

В этом случае z-index вообще не нужен.

Я задал z-index слою с ссылками, но разница в z-index работает только когда и слой с ссылками имеет position: absolute;

При другом позиционировании слой с position: absolute выше чем другой любой слой, в независимости от z-index

[Avalon4eg]

так проблема решена или нет?

можно логотип задать как фоновый рисунок для слоя с шириной на весь экран.

типа такого

bacground: ulr('logo.gif') 50% 0% no-repeat

и в этом слое разместить ссылки, но при этом на сам логотип не получится установить ссылку.

[fiver]

так проблема решена или нет?

можно логотип задать как фоновый рисунок для слоя с шириной на весь экран.

типа такого

bacground: ulr('logo.gif') 50% 0% no-repeat

и в этом слое разместить ссылки, но при этом на сам логотип не получится установить ссылку.

Проблемма решена. Навигацию разместил тоже в div с абсолютным позиционированием, но более высоким z-index.

Логотип не стал делать фоном по той самой причине, что он является переходом на главную страницу.

Надеялся что у кого нибудь есть готовое элегантное решение, как выравнять div по центру, учитывая сами размеры слоя.