Formatowanie menu

[wisnia80]

Witam,

Mam menu sformatowane jak na zdjęciu.

Mam ustawione border jak w kodzie - teraz mam kłopot po kliknięciu w miejscu i rozwinięciu sie podmenu mam zamiast pojedynczej lini bocznej 1px linie znacznie grubszą "whats new..."

1. Jak tego uniknąć usunąć?
2. Jak formatować podmenu?


.moduletablemenu {
color:#aad6a1;
margin-bottom:1em;
padding:0;
}

.moduletablemenu h3 {
background:#766;
color:#fff;
text-align:center;
font-size:1.1em;
border:1px solid #fff;
margin:0;
padding:0.25em 0;
}

.moduletablemenu ul {
list-style:none;
margin:0;
padding:0;
}

.moduletablemenu li {
border-bottom:1px solid #212121;
border-left:1px solid #212121;
border-right:1px solid #212121;
margin:0;
}

.moduletablemenu li a {
display:block;
background-color:#CC6666;
color:#fff;
text-decoration:none;
padding:3px 5px 3px 0.5em;
}

.moduletablemenu a:hover, .moduletablemenu a:link, .moduletablemenu a:active{

background-color:#aad6a1;
color:#fff;
}

[zwiastun]

dodaj: border-collapse:collapse;

[wisnia80]

Albo źle wklejam tzn w niewłaściwe miejsce, albo to nie daje zamierzonego efektu niestety:confused:

[zwiastun]

Powodem może być brak deklaracji dla drugiego poziomu listy. Masz tylko wspólne reguły dla wszystkich poziomów:
.moduletablemenu li {
border-bottom:1px solid #212121;
border-left:1px solid #212121;
border-right:1px solid #212121;
margin:0;
}
Może tzreba poeksperymentować z
.moduletablemenu li ul li {} (lub krócej .moduletablemenu li li {})

[wisnia80]

Może tzreba poeksperymentować z
.moduletablemenu li ul li {} (lub krócej .moduletablemenu li li {})


Dzieki, właśnie eksperymentuje...

[wisnia80]

Dodałem sekcje


.moduletablemenu li ul li {
list-style:none;
padding-left:10px;
border:none;
background-color:#CC6666;
}

.moduletablemenu li ul li a:hover, .moduletablemenu li ul li a:link, .moduletablemenu li ul li a:active {
background-color:#aad6a1;
}

i jest ok
:)