HELP! Как сделать такое меню?

[cyberd0g]

Проблема в том,что фон у самой менюхи и подменюхи должен быть прозрачным!

У меня вообще нет идей как это реализовать! Надеюсь на конструктивные советы. Заранее благодарен.

Edited April 16, 2012 by alexriz
Дублировать темы не нужно!!!!

[alex_anderr]

Блоками.

У верхних кнопок сделать границы слева, сверху, справа.

При наведении на верхний блок: нижнего блока границы слева, снизу, справа.

http://htmlbook.ru/css/border-bottom

http://htmlbook.ru/css/hover

Edited April 17, 2012 by alex_anderr

[MacPherson]

http://htmlbook.ru/blog/poluprozrachnyy-fon

[cyberd0g]

Блоками.

У верхних кнопок сделать границы слева, сверху, справа.

При наведении на верхний блок: нижнего блока границы слева, снизу, справа.

http://htmlbook.ru/css/border-bottom

http://htmlbook.ru/css/hover

Но тут еще дело в том, что ширина пунктов меню и подменю может быть различной.

[Switch74]

это не проблема, если у контейнера пункта меню нет overflow:hidden; то блок с подменю просто будет появляться вне пределов этого контейнера

<style>
div.menu{position:relative;}
div.menu a{display:inline-block;position:relative;padding:0px 10px;height:30px;line-height:30px;border:1px solid transparent;z-index:2;}
span.menu{display:inline-block;position:relative;height:30px;z-index:10;}
span.menu:hover>a{border:1px solid #bbb;}
span.menu:hover>div.podmenu{display:block;}
span.menu:hover>div.podmenu+a{border-bottom:1px solid #fff;}
div.podmenu{display:none;position:absolute;white-space:nowrap;border:1px solid #bbb;left:0px;top:31px;z-index:1;}
</style>
<div class="menu">
	<span class="menu">
		<a href="#">link1</a>
	</span>
	<span class="menu">
		<div class="podmenu">
			<a href="#">link21</a>
			<a href="#">link22</a>
			<a href="#">link23</a>
		</div>
		<a href="index.html">link2</a>
	</span>
	<span class="menu">
		<a href="#">link3</a>
	</span>
</div>

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

[cyberd0g]

Switch74, я еще до конца не разобрался как это работает, но ОГРОМНОЕ СПАСИБО! респект, мужик!

[Switch74]

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