|
|||
Navigationsbereich falsch ausgerichtet
Hey Leute,
ich hoffe mir kann jemand helfen, ich habe ein kleines Problemchen mit meinem Navigationsbereich. Ich hätte gerne 4 Elemente linksbündig, und 1 Element rechtsbündig. Aber wenn ich das so mache, ist das Element das rechts sitzt tiefer als die linksbündigen.. Das sieht dann ziemlich hässlich aus: http://jsfiddle.net/5nyuzjh1/ Der Code sieht so aus: HTML-Code:
<div id="topmenu" style="left: 0px; right: 0px; top: 0px"> <div id="navibereich"> <ul> <li id="aktuell">Home</li> <li id="info"><a href="info.html">Info</a></li> <li id="verleih"><a href="verleih.html">Ausleihen</a></li> <li id="hakju"><a href="hakju.html">HAKJU</a></li> <li id="login"><a href="login.html">Login</a></li> </ul> </div> </div> Code:
#topmenu { background-color:black; position: absolute; height: 50px; left: 0px; right: 0px; margin-top: 0px; position: absolute; position: fixed; border-bottom: thick maroon solid; vertical-align: middle; float: left; } #navibereich li { list-style-type: none; padding: 10px; margin-right: 20px; text-align: center; display: inline; top: 5px; font-weight: bold; overflow: hidden; } #navibereich li a{ color: white; font-size: 16; font-family: Arial, Helvetica, sans-serif; text-decoration: none; transition: color 0.2s linear 0s, font-size 0.2s linear 0s, padding 0.2s linear 0s; } #navibereich li a:hover{ color:#996600; font-size: 20px; padding:10px; } #aktuell{ color: #808080; font-family: Arial, Helvetica, sans-serif; font-size: 16; text-decoration: none; font-weight: bolder; cursor: pointer; transition: color 0.2s linear 0s, font-size 0.2s linear 0s, padding 0.2s linear 0s; } #aktuell:hover { color:#996600; font-size: 20px; padding:10px; font-weight: bolder; cursor: pointer; } #login { top: 0px; float: right; bottom: 10px; } Eine Frage noch, wie kann ich den Abstand des Menüs von der Oberseite "top" verringern? mfg Geändert von m4ri0 (28.09.2014 um 17:14 Uhr) |
Sponsored Links |
|
||||
Cleare das ul mit nem Clearfix (mirco clearfix googlen) und dann floate alle Elemente Links, und das letzte rechts.
Angaben wie top left right bottom wirken nur mit Positionen wie relative, absolute und fixed
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato... All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege www.richard-thiel.de | Müssen Websiten überall gleich ausschauen? |
Sponsored Links |
Stichwörter |
anordnung, css, html, navibereich, navigation |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Bräuchte Hilfestellung weil meine Seite nicht richtig angezeigt wird. | Picasso | CSS | 36 | 03.01.2011 20:41 |
IE6:Horizontales Menü wird unterschiedlich angezeigt:erst falsch, nach Reload korrekt | Ste | CSS | 0 | 25.02.2009 14:46 |
IE zeigt falsch, FF richtig - change - FF zeigts falsch, IE richtig | nick | CSS | 6 | 19.08.2006 03:02 |
nicht sichtbarer Text wird falsch ausgerichtet - IE | SURE612 | CSS | 4 | 15.10.2005 11:35 |
Site mit Firefox --> Ok ! Mit IE völlig falsch. Warum ? | mastermsc | CSS | 3 | 05.01.2005 22:46 |