Olá pessoal,
Estou implementando um menu em CSS a partir de uma consulta como segue o modelo abaixo:
Estilo CSS:
.menu /* Removendo bullets e colocando borda */
{
list-style:none;
border:0px none;
float:left;
}
.menu li /* ESTILIZANDO ITENS DO MENU */
{
list-style:none;
;
float:left;
border-right: 0px none; /*1px solid #c0c0c0;*/
}
.menu li a /* ESTILIZANDO LINKS 1 */
{
color:#fff;
text-decoration:none;
padding:5px 10px;
display:block;
}
.menu li a:hover /* ESTILIZANDO LINKS 2 */
{
background:#333;
color:#fff;
-moz-box-shadow:0 3px 10px 0 #CCC;
-webkit-box-shadow:0 3px 10px 0 #ccc;
text-shadow:0px 0px 5px #8B8B8B; /*#fff;*/
}
.menu li ul /* ESCONDENDO SUBMENU */
{
;
top:25px;
left:0;
background-color:#8B8B8B;
display:none;
color:#fff;
}
.menu li:hover ul, .menu li.over ul /* EXIBINDO SUBMENU */
{
display:block;
}
Código ASPx.VB:
Private Sub GerarMenuCSS()
Dim Ds1, Ds2 As Data.DataSet
Dim pLista1, pLista2 As New WebControls.ListBox
Ds1 = Formulario.ConsultaCategoria(" Formulario_Categoria IN (SELECT Y.Formulario_Categoria " & _
" FROM b005_permissoes X " & _
" INNER JOIN a001_formularios Y ON (Y.Formulario_Codigo = X.Formulario_Codigo) " & _
" WHERE X.Pessoa_Codigo = " & Session("sUsuario") & ") ", "")
pLista1.DataTextField = "CATEGORIA"
pLista1.DataValueField = "Formulario_Categoria"
pLista1.DataSource = Ds1
pLista1.DataBind()
pLista2.Items.Clear()
pLista2.Items.Add(" <ul class='menu'> ")
pLista2.Items.Add(" <li><a href='Index.aspx'>HOME</a></li> ")
For Each item As ListItem In pLista1.Items
Ds2 = Permissao.Consultar(" A.Pessoa_Codigo = " & Session("sUsuario") & " AND C.Formulario_Categoria = " & item.Value, "")
pLista2.Items.Add(" <li><a href='#'>" & item.Text & "</a> ")
pLista2.Items.Add(" <ul> ")
For C As Integer = 0 To Ds2.Tables(0).Rows.Count - 1
pLista2.Items.Add(" <li><a style='color:#fff; width:150px;' href='" & Ds2.Tables(0).Rows(C)("Formulario_Arquivo") & "' target='" & Ds2.Tables(0).Rows(0)("Formulario_Target") & "'>" & UCase(Ds2.Tables(0).Rows(C)("Formulario_Menu")) & "</a></li> ")
Next
pLista2.Items.Add(" </ul><li> ")
Next
pLista2.Items.Add(" <li><a href='../Index.aspx'>SAIR</a></li> ")
pLista2.Items.Add(" </ul>")
For Each item As ListItem In pLista2.Items
Label1.Text = Label1.Text & item.Text
Next
End Sub
A questão é que gostaria que, ao passar o mouse sobre os itens do menu os submenus ficassem alinhados à esquerda, como nesta
figura.
Alguém poderia ajudar?
Grato,
Ilano.