nicht angemeldet
CSS Navigation
Hi,
ich habe die CSS Navigation von dieser Homepage ausprobiert. Dies ist der Abgeänderte Quelltext:
<html>
<head>
<title>Geteilte Navigationsleisten</title>
<style type="text/css">
body, p a {
font: normal 100.01% Tahoma, sans-serif;
color: white; background-color: #ffffff;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: center;
}
ul#Navigation li {
list-style: none;
float: left;
position: relative;
height: 29px;
}
* html ul#Navigation li {
height: 29px;
}
ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
display: none;
}
* html ul#Navigation li ul {
}
ul#Navigation li:hover ul {
display: block;
}
ul#Navigation li ul li {
float: none;
display: block;
margin-top: 4px;
}
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: -0.1em;
lef\t: -0.1em;
}
ul#Navigation a, ul#Navigation span {
display: block;
text-decoration: none;
color: white; background-color: #008AD2;
}
* html ul#Navigation a, * html ul#Navigation span {
}
</style>
<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 = "#FFFFFF";
}
function ausblenden() {
sucheUL(this.firstChild).style.display = "none";
}
window.onload=hoverIE;
}
</script>
</head>
<body>
<ul id="Navigation" >
<li style="width:115px;"><a href="#Beispiel">Home</a></li>
<li style="width:255px;"><a href="#Beispiel">Wir über uns</a>
<ul style="width:255px;">
<li style="width:255px;"><a href="#Beispiel">Eine Traumgemeinde?</a></li>
<li style="width:255px;"><a href="#Beispiel">Kirche und wir</a></li>
</ul>
</li>
<li style="width:249px;"><a href="#Beispiel">Unser Programm</a>
<ul style="width:249px;">
<li style="width:249px;"><a href="#Beispiel">Veranstaltung</a></li>
<li style="width:249px;"><a href="#Beispiel">Unsere Jugend</a></li>
<li style="width:249px;"><a href="#Beispiel">Jugend4you</a></li>
<li style="width:249px;"><a href="#Beispiel">Hauskreise</a></li>
<li style="width:249px;"><a href="#Beispiel">Regenbogenland</a></li>
<li style="width:249px;"><a href="#Beispiel">Unsere Jugend</a></li>
</ul>
</li>
<li style="width:200px;"><a href="#Beispiel">Kontakt</a>
<ul style="width:200px;">
<li style="width:200px;"><a href="#Beispiel">Wie komm ich hin?</a></li>
<li style="width:200px;"><a href="#Beispiel">Adressen</a></li>
</ul>
</li>
<li style="width:160px;"><a href="#Beispiel">Links</a>
<ul style="width:160px;">
<li style="width:160px;"><a href="#Beispiel">Christliche Links</a></li>
<li style="width:160px;"><a href="#Beispiel">Gemeindebrief</a></li>
<li style="width:160px;"><a href="#Beispiel">Predigten</a></li>
</ul>
</li>
</ul>
</body>
</html>
ich hab schon probiert überall style="height:29px;" einzusetzen, aber die Höhe beträgt immer 19 px! wisst ihr wo ich den Wert eintragen müsste?
-
hi,
ich hab schon probiert überall style="height:29px;" einzusetzen, aber die Höhe beträgt immer 19 px!
Ach - und wo ist "überall" ...?
wisst ihr wo ich den Wert eintragen müsste?
Auf jeden Fall an einer Stelle (d.h., für ein Element), für den height auch eine Auswirkung haben kann.
Und außerdem solltest du es natürlich nicht "überall" an den Elementen selbst reinschreiben - sondern nach Möglichkeit deines Styledefinitionen in eine externe CSS-Datei auslagern.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
hi,
ich hab schon probiert überall style="height:29px;" einzusetzen, aber die Höhe beträgt immer 19 px!
Ach - und wo ist "überall" ...?
also ich habs in den folgende tags probiert:
<li>
<ul>
<li>(unterdeorgnete Liste)
<ul>und ich folgenden CSS bereichen:
ul#Navigation a, ul#Navigation span
html ul#Navigation li ul
ul#Navigation li ul li
ul#Navigation li ul
html ul#Navigation li
ul#Navigation li
ul#Navigationund das ist alles was relavant ist.
Wisst ihr was ich falsch mache?
Danke im vorraus(auch an dich wahsaga)-
hi,
ich hab schon probiert überall style="height:29px;" einzusetzen, aber die Höhe beträgt immer 19 px!
Ach - und wo ist "überall" ...?
also ich habs in den folgende tags probiert:
<li>
<ul>
<li>(unterdeorgnete Liste)
<ul>und ich folgenden CSS bereichen:
ul#Navigation a, ul#Navigation span
html ul#Navigation li ul
ul#Navigation li ul li
ul#Navigation li ul
html ul#Navigation li
ul#Navigation li
ul#Navigationund das ist alles was relavant ist.
Wisst ihr was ich falsch mache?
Danke im vorraus(auch an dich wahsaga)Entferne height in anderen Tags, und dann probiere es.
-
-
-
Hi,
* html ul#Navigation li {
height: 29px;
}wozu dieser Hack, wenn Du damit nichts änderst?
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: -0.1em;
lef\t: -0.1em;
}und wozu hier die unterschiedlichen Angaben?
<li style="width:249px;"><a href="#Beispiel">Unser Programm</a>
<ul style="width:249px;">
<li style="width:249px;"><a href="#Beispiel">Veranstaltung</a></li>wozu die (zudem immer gleichen) inline-styles?
ich hab schon probiert überall style="height:29px;" einzusetzen, aber die Höhe beträgt immer 19 px!
Welche Höhe? Ich sehe nirgends eine Regel, die die Höhe der li-Elemente sichtbar machen würde.
freundliche Grüße
Ingo-
Hi,
wie schon gesagt ich habs überall probiert aber wieder ausgeschnitten, weil ich dachte das sie sich sozusagen gegenseitig behindern.
Hier die originale Navi:
http://de.selfhtml.org/css/layouts/navigationsleisten.htm#ebenenDie Navi hab ich abgeändert und sachen wie border ausgenommen damits besser in mein Design passt aber jetzt klaptt das ja irgendwie nicht mehr.
* html ul#Navigation li {
height: 29px;
}
wozu dieser Hack, wenn Du damit nichts änderst?Wie schon gesagt da war mal was drin und ich dachte vlt. bruach ich es nochmal
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: -0.1em;
lef\t: -0.1em;
}
und wozu hier die unterschiedlichen Angaben?Kein Ahnung! Als ich die nicht drinstehen hatte sah die Navigation im IE verrutscht aus mit den Werten kaum.
Keine Ahung<li style="width:249px;"><a href="#Beispiel">Unser Programm</a>
<ul style="width:249px;">
<li style="width:249px;"><a href="#Beispiel">Veranstaltung</a></li>
wozu die (zudem immer gleichen) inline-styles?ich hab schon probiert überall style="height:29px;" einzusetzen, aber die Höhe beträgt immer 19 px!
Welche Höhe? Ich sehe nirgends eine Regel, die die Höhe der li-Elemente sichtbar machen würde.Alle rauskopiert davor sah ein style tag immer so aus:
sytle="width:xxx px;height:29px;"
hat aber nichts gebrachtMFG
Mark
-