|
|||
Problem mit horizontaler Ausrichtung der Listen Navigation
Guten Tag zusammen,
habe leider ein Problem, zu dem ich noch keine Lösung finden konnte. Bei einem Layout, welches ich gerade erstelle, habe ich als erstes ein DIV-Block, in dem dann eine Liste als Menue ist. Jene ist Horizontal ausgerichtet (also von links nach rechts) und soll auch Mittig zentriert sein. Das klappt auch, solange die Breite der Liste möglichst gering ist. Bei dem Test habe ich eine Breite von 40% genommen und insgesamt sechs Wörter zum testen. Das ganze aber auf einer recht Breiten Auflösung (1440x900 Pixel), da ich aktuell nur meinen Laptop zum testen habe. Wenn ich die Breite nun noch kleiner fasse, dann habe ich den Effekt, dass nicht alle Wörter nebeneinander passen, was ja "normal" ist, wenn man die Breite beschränkt. Gebe ich für die Breite einen größeren Wert an, dann ist es leider nicht mehr richtig zentriert. Da ich das Layout später mit einem Blog-System nutzen möchte und ich keinen Einfluss auf die Inhalte der Webseite haben werde, weiß ich auch nicht, wie viele "Listen Punkte" es geben wird. Werden es weniger, gibt es nicht so große Probleme, doch wenn es zu viele werden und dann eben nicht mehr nebeneinander Platz finden, habe ich das Problem, dass sie dann nach unten "rutschen". Und genau das ist schlecht. Denn das Layout ist für einen guten Kumpel, der von seinem Auslandsjahr bloggen möchte und daher kann ich auf diese Liste keinen einfluss nehmen. (Sie entsteht durch die "festen Seiten", die er selbst im Administrationsmenue seines Blogs anlegen kann.) Gibt es eine Möglichkeit, dass man diesen "Fehler" beheben kann? Denn es wäre schön, wenn auch der Punkt der Breite "dynamisch" ist, damit es "egal" ist, wie viele Punkte man in der Liste hat. Das DIV in dem die Liste ist, schaut so aus: HTML-Code:
#kopf { display:block; margin:0em; padding:0.5em; background-color:#990000; text-align:center; border-top:none; border-left:none; border-right:none; border-bottom:0.25em solid #666666; } HTML-Code:
#kopf ul {display:block; margin:0 auto; width:40%;} #kopf li {display:block; float:left; margin:0.15em; } #kopf li a:link { color:#CCCCCC; text-decoration:none;} #kopf li a:visited { color:#CCCCCC; text-decoration:none;} #kopf li a:hover { color:#FFFFFF; font-weight:bold; text-decoration:underline; } Hoffe ihr könnt mir weiter helfen. Liebe Grüße und vielen Dank Tobias/Muckel |
Sponsored Links |
|
|||
Du hast ja nur simple Textlinks -- da brauchst du kein Float. Stell sie mit display:inline nebeneinander, dann kannst du mit text-align zentrieren.
Ansonsten gibt's auch noch FAQ Punkt 13.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
Sponsored Links |
|
|||
Guten Tag,
vielen Dank - mit display-inline funktioniert es und nun ist es egal, wie breit es ist. Hatte die Suchfunktion benutzt und auch einige Threads zu dem Thema gefunden, aber irgendwie nicht das passende und auch nicht den FAQ-Punkt. Aber nun klappt es ja Vielen Dank Muckel/Tobias |
Stichwörter |
ausrichtung, horizontale ausrichtung, horizontale menüs, horizontale navigation, listen menü |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Dropdown Navigation Problem in Opera | xuxu | CSS | 1 | 28.01.2011 17:45 |
Problem mit FlyOut Menu im IE7 | quarki69 | CSS | 5 | 15.03.2010 16:46 |
Anfänger - Problem Navigation Bar | RedDevil210 | CSS | 9 | 21.10.2009 13:39 |
Problem mit overflow, Navigation verschoben... | buemplizer | CSS | 9 | 09.09.2009 10:43 |
Problem mit CSS Dropline menü | horst77 | CSS | 1 | 12.08.2009 12:49 |