|
|||
Meine neue Navigation funktioniert, aber sie ist optisch nicht schön!
Hallo,
meine Webseite europas-handelshaus.com habe ich mit einer Vorlage von os-templates.com überarbeitet. Dabei gefiel mir nicht, das nur der Text bei Mauskontakt die Farbe ändert. Darum habe ich es mit meiner alten Navigation versucht und es funktioniert auch. Der einzige Nachteil ist, das bei Mauskontakt mit „Aufträge & Selbständige“ und „Jobsuchmaschinen“ die weißen Flächen keinen Seitenabstand haben. Darum habe ich es margin oder padding versucht und Werte in px, em oder rem eingegeben, nichts funktioniert. Außer bei Padding, da wird es nach oben und unten größer. Und wenn ich " " ein oder mehrmals einsetze, das funktioniert, aber es ist optisch nicht schön, denn wenn ich mit kleineren Monitoren die Navigation anwähle, sind die beiden Wörter eingerückt. Nur bei den Hauptwörter, die eine Subebene haben, funktioniert es einwandfrei. Vielleicht kann mir jemand helfen und mir schreiben, was ich wo eingeben muss, da ich selber kein Webdesigner bin und es auch mit anderen Vorlagen aus dem Internet versucht habe, aber es passt nicht, ich bekomme es nicht hin. Vielen Dank Michael Am Ende der Code meiner Topnav: #topnav { padding: 0; color: #C0BAB6; background-color: darkblue; clear: both; word-wrap: normal; white-space: nowrap; } #topnav ul { margin: 0; padding-left: 0; list-style: none; text-transform: uppercase; font-size: 12px; white-space: normal; } #topnav ul ul { z-index: 9999; position: absolute; width: 190px; text-transform: none; border-left: 1px solid darkblue; border-right: 1px solid darkblue; border-bottom: 1px solid darkblue; } #topnav ul ul ul, #topnav ul ul ul ul { left: 190px; top: 0; border: } #topnav ul:first-child li:last-child > ul { right: 0; border: } #topnav ul:first-child > li:last-child li > ul { left: -190px; } #topnav li { position: relative; display: block; float: left; margin: 0 30px 0 0; padding: 0; } #topnav li:first-child {} #topnav ul:first-child li:last-child { margin-right: 0; } #topnav li li { width: 100%; margin: 0; } #topnav li a { display: block; padding: 20px 0; } #topnav li li a { display: block; margin: 0; padding: 10px 15px; } #topnav ul ul { display: none; } #topnav ul li:hover > ul { display: block; } #topnav a { color: white; background-color: darkblue; font-weight: bold; } #topnav li li a, #topnav li.active li a { color: darkblue; background: white; font-weight: normal; } #topnav li.active a, #topnav a:hover { color: darkblue; background-color: white; } #topnav ul li li:hover > a { color: white; background-color: darkblue; } #topnav li a.drop, #topnav li.active a.drop { padding-right: 20px; padding-left: 15px; background-image: url("images/dropdown_side.gif"); background-position: 5px center; background-repeat: no-repeat; } #topnav form { display: block; height: 30px; margin: 0 auto; padding: 20px 0; } #topnav form select { display: block; width: 100%; padding: 8px; color: darkblue; background-color: white; border: 1px solid #494949; cursor: pointer; outline: none; } #topnav form select option { display: block; margin: 10px; padding: 0; cursor: pointer; outline: none; border: none; } |
Sponsored Links |
Sponsored Links |
Stichwörter |
navigationsproblem |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Float-Problem? | mischaef | CSS | 33 | 20.10.2010 17:20 |
Feste Breite in Navigationsleiste ändern | imho74 | CSS | 0 | 28.04.2010 23:50 |
Navigation im Boxmodell funktioniert nicht | bikersw | CSS | 2 | 05.10.2006 23:24 |
Navigation mit Opazität funktioniert unter IE nicht - was mache ich falsch? | mode101 | CSS | 4 | 30.09.2006 16:25 |
im mac verutscht die Navigation nach oben. Warum? | CSS-Newbie | CSS | 1 | 21.09.2004 17:29 |