Drillerkiller
Grünschnabel
3 kleine Probleme beim Dropdownmenü
Ich hab einige Probleme mit mienem Drop Down Menü. Ich würde mich freuen wenn ihr mir bei einigen helfen könnt.
Also das sind die Probleme:
1. Zwischen den Buttons sind Lücken. Aber ich meöchte das die Butoons zusammenhängen und ich weiß nicht was ich dafür machen muss.
2.Ich möchte die Schrift- und Buttongröße verkleinern.
3. Die Buttons sollen alle gleich groß sein.
Hier ist der code:
Hier ist die Seite hochgeladen.
Ich würd mich freuen wenn ich irgendwann eine Antwort bekomme. Danke schonmal im vorraus.
Ich hab einige Probleme mit mienem Drop Down Menü. Ich würde mich freuen wenn ihr mir bei einigen helfen könnt.
Also das sind die Probleme:
1. Zwischen den Buttons sind Lücken. Aber ich meöchte das die Butoons zusammenhängen und ich weiß nicht was ich dafür machen muss.
2.Ich möchte die Schrift- und Buttongröße verkleinern.
3. Die Buttons sollen alle gleich groß sein.
Hier ist der code:
Code:
<html>
<head>
<title></title>
<script type="text/javascript">
if(window.navigator.systemLanguage && !window.navigator.language) {
function hoverIE() {
var LI = document.getElementById("Navigation").firstChild;
do {
if (sucheUL(LI.firstChild)) {
LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
}
LI = LI.nextSibling;
}
while(LI);
}
function sucheUL(UL) {
do {
if(UL) UL = UL.nextSibling;
if(UL && UL.nodeName == "UL") return UL;
}
while(UL);
return false;
}
function einblenden() {
var UL = sucheUL(this.firstChild);
UL.style.display = "block"; UL.style.backgroundColor = "white";
}
function ausblenden() {
sucheUL(this.firstChild).style.display = "none";
}
window.onload=hoverIE;
}
</script>
<style type="text/css">
body {
font: normal 100.01% Helvetica, Arial, sans-serif ;
color: black; background-color: white;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: center;
}
ul#Navigation li {
list-style: none;
float: left;
width: 8.6em;
position: relative;
margin: 0.4em; padding: 0;
}
* html ul#Navigation li { /* Korrektur fuer den IE 5 und 6 */
margin-bottom: -0.4em;
}
*:first-child+html ul#Navigation li { /* Korrektur fuer den IE 7 */
margin-bottom: -0.1em;
}
ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 1.7em; left: -0.4em;
}
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: -1.5em;
lef\t: -0.4em;
}
ul#Navigation li ul li {
float: none;
display: block;
margin-bottom: 0.2em;
}
ul#Navigation a, ul#Navigation span {
display: block;
padding: 0.2em 1em;
text-decoration: none; font-weight: bold;
border: 1px solid black;
border-left-color: white; border-top-color: white;
color: maroon; background-color: #ccc;
}
* html ul#Navigation a, * html ul#Navigation span { /* nur fuer IE erforderlich */
width: 100%;
w\idth: 6.4em;
}
body {
font: normal 100.01% Helvetica, Arial, sans-serif;
color: black; background-color: #white;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: center;
}
ul#Navigation li {
list-style: none;
float: left; /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
margin: 0.4em; padding: 0;
}
* html ul#Navigation li { /* Korrektur fuer den IE 5 und 6 */
margin-bottom: -0.4em;
}
*:first-child+html ul#Navigation li { /* Korrektur fuer den IE 7 */
margin-bottom: -0.1em;
}
ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 1.6em; left: -0.4em;
display: none; /* Unternavigation ausblenden */
}
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: -1.5em;
lef\t: -0.4em;
}
*:first-child+html ul#Navigation ul { /* Workaround fuer den IE 7 */
background-color:silver; padding-bottom:0.4em;
}
ul#Navigation li:hover ul {
display: block; /* Unternavigation in modernen Browsern einblenden */
}
ul#Navigation li ul li {
float: none;
display: block;
margin-bottom: 0.2em;
}
ul#Navigation a, ul#Navigation span {
display: block;
width: 6.4em; /* Breite den in li enthaltenen Elementen zuweisen */
padding: 0.2em 1em;
text-decoration: none; font-weight: bold;
border: 1px solid black;
border-left-color: black; border-top-color: black;
color: black; background-color: #ccc;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 8.6em; /* Breite nach altem MS-Boxmodell für IE 5.x */
w\idth: 6.4em; /* korrekte Breite fuer den IE 6 im standardkonformen Modus */
}
</style>
</head>
<body>
<ul id="Navigation" >
<li><a href="#Beispiel">Home</a>
<ul>
<li><a href="#Beispiel">News</a></li>
<li><a href="#Beispiel">Kontakt</a></li>
<li><a href="#Beispiel">Über uns</a></li>
</ul>
<li><a href="#Beispiel">Serien</a>
<ul>
<li><a href="#Beispiel">Alphabet</a></li>
<li><a href="#Beispiel">Kategorie</a></li>
</ul>
</li>
<li><a href="#Beispiel">Filme</a></li>
<ul>
<li><a href="#Beispiel">Alphabet</a></li>
<li><a href="#Beispiel">Kategorie</a></li>
<li><a href="#Beispiel">Kinofilme</a></li>
</ul>
</li>
<li><a href="#Beispiel">Schauspieler</a>
<ul>
<li><a href="#Beispiel">Alphabet</a></li>
<li><a href="#Beispiel">Kategorie</a></li>
</ul>
</li>
<li><a href="#Beispiel">Games</a></li>
<ul>
<li><a href="#Beispiel">Alphabet</a></li>
<li><a href="#Beispiel">Kategorie</a></li>
</ul>
</li>
<li><a href="#Beispiel">TV</a></li>
<ul>
<li><a href="#Beispiel">Programm</a></li>
</ul>
</li>
<li><a href="#Beispiel">Forum</a></li>
</ul><div></div></div>
</body>
</html>
Hier ist die Seite hochgeladen.
Ich würd mich freuen wenn ich irgendwann eine Antwort bekomme. Danke schonmal im vorraus.
Zuletzt bearbeitet: