04.04.2013, 17:29
|
|||
|
|||
Horizontale Navigation CSS
Liebe Community,
erstmal möchte ich hallo sagen, da ich neu bin. Der Grund wieso ich hierher gefunden habe liegt klar auf der Hand, ich habe ein Problem mit CSS und hoffe das mir hier jemand helfen kann. Das Problem ist, das ich eine Navi habe, welche eine Liste mit Bildern ist. HTML: HTML-Code:
<ul class="nav"> <li class="home"><a href='#'></a></li> <li class="3st"><a href='#'></a></li> <li class="com"><a href='#'></a></li> <li class="media"><a href='#'></a></li> <li class="mitglied"><a href='#'></a></li> <li class="kontakt"><a href='#'></a></li> <li class="help"><a href='#'></a></li> </ul> Code:
/* NAVIGATION */
.nav {
list-style-type:none;
margin:0;
padding:0;
width: 1112px;
height: 60px;
display: block;
}
.nav li a {
display: block;
background:#000 url(Bilder/navbar.png) 0 0;
}
/* */
.home a {
width: 128px;
height: 60px;
background-position: 0 0;
}
.home a:hover {
width: 128px;
height: 60px;
background-position: 0 -60px;
}
.3st a {
width: 217px;
height: 60px;
background-position: 128px 0;
}
.3st a:hover {
width: 217px;
height: 60px;
background-position: 128px -60px;
}
.com a {
width: 184px;
height: 60px;
background-position: 217px -60px;
}
.com a:hover {
width: 184px;
height: 60px;
background-position: 0 0;
}
.media a {
width: 119px;
height: 60px;
background-position: 0 0;
}
.media a:hover {
width: 119px;
height: 60px;
background-position: 0 0;
}
.mitglied a {
width: 248px;
height: 60px;
background-position: 0 0;
}
.mitglied a:hover {
width: 248px;
height: 60px;
background-position: 0 0;
}
.kontakt a {
width: 140px;
height: 60px;
background-position: 0 0;
}
.kontakt a:hover {
width: 140px;
height: 60px;
background-position: 0 0;
}
.help a {
width: 76px;
height: 60px;
background-position: 0 0;
}
.help a:hover {
width: 76px;
height: 60px;
background-position: 0 0;
}
Ich bitte um Hilfe. MfG mLa P.S.: Link zum anschauen: <? echo PAGETITLE; ?> 
|
| Sponsored Links |
|
04.04.2013, 18:08
|
|||
|
|||
|
Hallo Deine Seite zeigt im Validator jede Menge Fehler:
http://validator.w3.org/check?uri=ht...Inline&group=0 Ausserdem verwendest du Tabellen für dein Design, das macht man nicht. Fang am Besten noch mal neu an. Verwende die HTML-Elemente richtig. Style mit CSS und Javascript lässt du erst mal aussen vor, das kommt ganz zum Schluss. Deine Seite sollte folgenden Aufbau haben: Oben Mitte Unten
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..." Aus einem Forum.
|
| Sponsored Links |
|
04.04.2013, 18:54
|
|||
|
|||
|
Ich will es ja nicht validieren, ich will nur das es läuft. Das Problem ist wirklich nur, dass er beim Hovern die Background Position nicht richtig erwischt. Obwohl es gehen müsste.
|
|
04.04.2013, 19:05
|
||||
|
||||
|
Zitat:
 Du hast nicht nur ein Problem, du hast wie o.g. sehr viele!
|
|
04.04.2013, 19:14
|
|||
|
|||
|
Ein hilfreicher Tipp , außer 'guck noch mal von vorn & fang anders an', würde mich echt freuen. Sorry, ich bin neu in der Sache und bin froh das erstmal was klappt. Im Endeffekt werd' ich es eh noch ein paar mal umwerfen, aber derzeit will ich nur die Navigation lösen.
|
|
04.04.2013, 19:14
|
|||
|
|||
|
Zitat:
Die Browser stimmen da überein und machen was sie wollen wenn sie falschen, also invaliden Code erhalten und daraus resultieren dann viele Darstellungsfehler. Willst du die Darstellungsfehler wech haben, muss der Code valide sein und der Validator vom W3C zeigt dir hübsch die Fehler an. Wenn du die Fehler nicht verstehst kannst du immer noch hier fragen oder du bemühst Google translate, den Übersetzungsservice von Google. Was Manfred62 geschrieben hat trifft es übrigens haargenau.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..." Aus einem Forum.
|
 |
| Stichwörter |
| bilder, css, horizontal, menü, navigation |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| Problem mit Navigation | safari | CSS | 12 | 20.04.2011 12:11 |
| Redesign für Steiner Cycling Team | pkipper | Site- und Layoutcheck | 11 | 09.02.2011 13:25 |
| Hilfe bei CSS Navigation | trimalchio | CSS | 7 | 10.01.2011 14:13 |
| CSS Navigation - Problem mit IE6 | pcklinik | CSS | 4 | 18.09.2007 13:04 |
| css Navigation nur mit Bildern | van-delle | CSS | 3 | 14.07.2007 17:08 |
Linear-Darstellung
