menu hover blijft wit
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
#navbar {
margin: 0;
padding: 0;
height: 1em;
}
#navbar li {
list-style: none;
float: left;
}
#navbar li a {
display: block;
padding: 3px 8px;
background-color: white;
color: black;
text-decoration: none;
}
#navbar li ul {
display: none;
width: 10em; /* Width to help Opera out */
background-color: white;
}
#navbar li:hover ul, #navbar li.hover ul {
display: block;
position: absolute;
margin: 0;
padding: 0;
background-color:#E0E0E0;
}
#navbar li:hover li, #navbar li.hover li {
float: none;
background-color:#E0E0E0;
}
#navbar li:hover li a, #navbar li.hover li a {
background-color: #E0E0E0;
border-bottom: 1px solid black;
color: black;
}
#navbar li li a:hover a:active {
background-color: #E0E0E0;
}
margin: 0;
padding: 0;
height: 1em;
}
#navbar li {
list-style: none;
float: left;
}
#navbar li a {
display: block;
padding: 3px 8px;
background-color: white;
color: black;
text-decoration: none;
}
#navbar li ul {
display: none;
width: 10em; /* Width to help Opera out */
background-color: white;
}
#navbar li:hover ul, #navbar li.hover ul {
display: block;
position: absolute;
margin: 0;
padding: 0;
background-color:#E0E0E0;
}
#navbar li:hover li, #navbar li.hover li {
float: none;
background-color:#E0E0E0;
}
#navbar li:hover li a, #navbar li.hover li a {
background-color: #E0E0E0;
border-bottom: 1px solid black;
color: black;
}
#navbar li li a:hover a:active {
background-color: #E0E0E0;
}
Help?
Marc Maas op 06/09/2010 14:40:32:
li:hover wordt niet ondersteund door IE 7 en ouder. Heb je dit ook getest in andere browsers?
Dalando, jij vond IE toch zo'n goede browser? Hier weer zo'n voorbeeld waarom IE KUT is!
Oetzie en mijn achternaam op 06/09/2010 15:43:05:
Dalando, jij vond IE toch zo'n goede browser? Hier weer zo'n voorbeeld waarom IE KUT
Marc Maas op 06/09/2010 14:40:32:
li:hover wordt niet ondersteund door IE 7 en ouder. Heb je dit ook getest in andere browsers?
Dalando, jij vond IE toch zo'n goede browser? Hier weer zo'n voorbeeld waarom IE KUT
Maar ik zit in IE8 :P En die is prima :P en in Firefox en chrome ook niks...?
Of IE k*t is of niet is niet de vraag. Het grootst aantal gebruikers werkt nu eenmaal met IE, je zult moeten zorgen dat het werkt in IE. Zo ook in IE 7 en ouder. IE 6 en 7 zijn nog steeds meest gebruikte browers.
Wel verstandig om eerst te testen in Firefox! Later wijzigen voor IE is simpeler dan andersom.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
#navbar {
margin: 0;
padding: 0;
height: 1em;
}
#navbar li {
list-style: none;
float: left;
}
#navbar li a {
display: block;
padding: 3px 8px;
background-color: white;
color: black;
text-decoration: none;
}
#navbar ul li {
float: left;
width: 10em; /* Width to help Opera out */
display: inline;
overflow: hidden;
background-color: white;
}
#navbar li:hover {
float: left;
display: inline;
}
#navbar ul li a:hover {
float:left;
width: 10em;
display: inline;
overflow: hidden;
background-color: #E0E0E0;
color: #000000;
text-decoration:none;
}
margin: 0;
padding: 0;
height: 1em;
}
#navbar li {
list-style: none;
float: left;
}
#navbar li a {
display: block;
padding: 3px 8px;
background-color: white;
color: black;
text-decoration: none;
}
#navbar ul li {
float: left;
width: 10em; /* Width to help Opera out */
display: inline;
overflow: hidden;
background-color: white;
}
#navbar li:hover {
float: left;
display: inline;
}
#navbar ul li a:hover {
float:left;
width: 10em;
display: inline;
overflow: hidden;
background-color: #E0E0E0;
color: #000000;
text-decoration:none;
}
Heb je anders een online voorbeeld. De HTML en de rest van de CSS willen nog wel eens voor onverwachte acties zorgen.
Code (php)
1
2
3
2
3
#navbar li a:hover {
background-color:#E0E0E0;
}
background-color:#E0E0E0;
}
Vergeten.. :O
De uiteindelijke code was
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
#navbar {
margin: 0;
padding: 0;
height: 1em;
}
#navbar li {
list-style: none;
float: left;
border:1px solid black;
}
#navbar li a {
display: block;
padding: 3px 8px;
background-color: white;
color: black;
text-decoration: none;
}
#navbar li a:hover {
background-color:#E0E0E0;
}
#navbar li ul {
display: none;
width: 10em; /* Width to help Opera out */
background-color: white;
}
#navbar li:hover ul, #navbar li.hover ul {
display: block;
position: absolute;
margin: 0;
padding: 0;
background-color:#E0E0E0;
}
#navbar li:hover li, #navbar li.hover li {
float: none;
}
#navbar li:hover li a, #navbar li.hover li a {
border-bottom: 1px solid black;
color: black;
}
margin: 0;
padding: 0;
height: 1em;
}
#navbar li {
list-style: none;
float: left;
border:1px solid black;
}
#navbar li a {
display: block;
padding: 3px 8px;
background-color: white;
color: black;
text-decoration: none;
}
#navbar li a:hover {
background-color:#E0E0E0;
}
#navbar li ul {
display: none;
width: 10em; /* Width to help Opera out */
background-color: white;
}
#navbar li:hover ul, #navbar li.hover ul {
display: block;
position: absolute;
margin: 0;
padding: 0;
background-color:#E0E0E0;
}
#navbar li:hover li, #navbar li.hover li {
float: none;
}
#navbar li:hover li a, #navbar li.hover li a {
border-bottom: 1px solid black;
color: black;
}