Nenhuma resposta neste tópico

[savage]

Pessoal, estou com um problema, tenho 1 menu como mostra abaixo, que a segunda linha de menus estão alinhados corretamente. Porem ao inserir submenus no primeiro menu, os menus de baixo ficam todos desalinhados.



Imagem2



Esse menu, é para loja virtual magento que seu css se chama mainmenu.css

o site como exemplo é esse http://www.espacoquallys.com.br/

Olhando o mainmenu.css do site acima é o mesmo usado aqui no meu em localhost. porem gostaria de uma ajuda que por ex:
Porem quero que seja como mostrei ma figura acima ex:

LG MOTOROLA SAMSUNG SONY ERICSSON SONY
Test1 Test1 Test1 Test1 Test1 Test1

FLIP LG FLIP MOTOROLA FLIP SAMSUNG FLIP SONY FLIP ERICSSON FLIP SONY
Test1 Test1 Test1 Test1 Test1 Test1


Mas, ao acrescentar por ex no Menu LG o submenu Test2 em baixo do Test1 o FLIP LG não saia da linha como está o FLIP MOTOROLA FLIP SAMSUNG FLIP SONY FLIP ERICSSON FLIP SONY. Ou seja, que todos eles desçam por igual. Não sei se me entendeu.


Segue o mainmenu.css

#custommenu {
	position: relative;
	z-index: 900;
	font-size: 12px; 
	padding: 0px 0px 0px 0px;
	width: 949px;
}
div.menu {
	float: left;
	padding: 0px 0px 2px 15px;
	margin: 0px;
	font-weight: normal;
	font-size: 12px;
	text-transform: uppercase;
	font-family: Tahoma;
	height: 26px;
	_width: 0px; /*IE6*/
	_padding: 0px 0px 0px 15px;
	_background: none;
}
div.menu a:link, div.menu a:visited {
	display: block;
	height: 23px;
	color: #fff;
}
div.menu a span {
	display: block;
	height: 20px;
	padding-right: 15px;
	padding-top: 6px;
}
div.menu a span:hover {
	cursor: pointer;
}
div.wp-custom-menu-popup {
	position: absolute;
	z-index: 3000;
	display: none;
	text-align: left;
	background: #f5f5f5;
	background: -moz-linear-gradient(top, #f5f5f5, #ededed);
	background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#ededed));
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#ededed');
	padding: 10px 10px 10px 15px;
	_width: 0px; /*IE6*/
	_margin-top: -3px;
	border-radius:  0px 0px 3px 3px;
	border-top: 0;
}
div.menu a, div.wp-custom-menu-popup a {
	text-decoration: none;
	display:block;
	cursor: pointer;
	_height: 0;
	height: auto;
	line-height:11px;
	padding: 2px 0px 2px 0px;
}
div.block2 {
	display: block;
	_width: 150px; /*IE6*/
}
div.wp-custom-menu-popup a.act {
	color: #1d1633;
}
div.column {
	float: left;
	width: 150px; /* column width */
	padding: 0px;
	margin: 0px 10px 0px 0px;
	_display: inline;/*IE6*/
}
div.itemSubMenu {
	margin-left: 0px;
}
.clearBoth {
	clear:both;
	height: 0;
	overflow: hidden;
}
a.level2:link, a.level2:visited {
	font-size: 11px;
	font-weight: normal;
	color: #333333;
}
a.level1:link, a.level1:visited {
	text-transform: uppercase;
	font-size: 11px;
	font-weight: bold;
}

div.level1 {
	margin-bottom: 10px;
}
/*custom tabs*/
.dd_menu_block {
	padding-top: 5px;
	border-top: 1px solid #e2e2e2;
	font-size: 11px;
	margin-top: 5px;
}
.dd_menu_block img {
	float: left;
	position: relative;
	margin-right: 10px;
}
div.cat_pic {
	height: 50px;
	margin-top: 0px;
	overflow: hidden;
}
div.cat_pic strong {
	color: #454545;
	position: absolute;
	bottom: 24px;
	left: 20px;
	font-size: 11px;
}
div.cat_pic span {
	position: absolute;
	bottom: 14px;
	left: 20px;
	color: #808080;
	font-size: 11px;
	z-index: 3050;
}
/*GREEN*/
#custommenu {
	background: #333333 url(../../../images/menu_bg.jpg) repeat-y;
}
div.menu a:hover {
	color: #f9ffca;
}
a.level2:hover {
	color: #0c0c2b;
}
div.wp-custom-menu-popup {
	border: 3px solid #0c0c2b;
}
a.level1:link, a.level1:visited {
	color: #0c0c2b;
}
a.level1:hover {
	color: #0c0c2b!important;
}

Edição feita por: savage, 15/05/2013, 00:47.