RastaROCKET Geschrieben 5. November 2008 Geschrieben 5. November 2008 Hallo Gemeinde! Ich hab ein wahrscheinlich recht simples Problem, aber ich komm einfach nicht auf die Lösung. Evtl. hab ich mich schon total verhtmlt... Ich will die drei Icons in der Subnavigation dieser Seite zentrieren, aber ich schaff es einfach nicht. <div id="SubNavigation"> <div style="margin:0 auto;"> <ul> <li class="subTitle"> <div class="projectNavIcon" > <a title="" href="#"> </a> </div> </li> </ul> <ul> <li class="subTitle"> <div class="projectNavIcon" > <a title="" href="#"> </a> </div> </li> </ul> </div> </div> Das umschließende Div hat die ID #SubNavigation. Hier hab ich text-align:center angegben. Ich dacht jetzt dass das DIV um die uls diese doch zentrieren müsste. Steh irgendwie auf dem Schlauch. #SubNavigation { width:758px; text-align:center; } #SubNavigation ul { list-style:none; margin:0px; padding:0px; } Die Listen brauche ich, da ich eigentlich, bei Mousover über einem Subnavigationspunkt unter diesem, den Titel des aktuellen Kontext anzeigen wollte. Also z. B. so: Wenn ihr eine bessere Idee habt würde ich mich freuen! Vielen Dank schon mal! Gruß, Kristof Zitieren
RastaROCKET Geschrieben 5. November 2008 Autor Geschrieben 5. November 2008 Bitte löschen :upps ... Zitieren
forTeesSake Geschrieben 7. November 2008 Geschrieben 7. November 2008 Also evtl geht es, wenn Du Deinem #SubNavigation ul oder dem <div> das um diese <ul> herum ist auch eine feste Breite gibst. Zitieren
RastaROCKET Geschrieben 10. November 2008 Autor Geschrieben 10. November 2008 Hallo forTeesSake Wenn ich dem ul eine feste Weite gebe, tut sich nichts. Dem DIV kann ich keine fest definierte width geben, da das es n Projekte (uls) enthalten kann. Zitieren
forTeesSake Geschrieben 10. November 2008 Geschrieben 10. November 2008 Oh ja, das verstehe ich. Da gibt es wohl ein Problem mit dem ""text-align: center" und dem float Deiner <ul> Alternativ würde ich die ganzen <ul> und <li> einfach weglassen, und nur Deine <a> nacheinander schreiben. Dann ist auch alles zentriert. Und die "onmouserver()" Anweisungen kannst Du ja auch in die <a> mit rein packen. also in etwa (nicht vollständig) <div id="SubNavigation"> <div style="text-align:center;"> <a href="/aktuell/0815/onlinegang/" onmouseover="" onmouseout="" title="Projekt Neues von der Homepage"> </a> <a href="/aktuell/0815/onlinegang/" onmouseover="" onmouseout="" title="Projekt Neues von der Homepage"> </a> <a href="/aktuell/0815/onlinegang/" onmouseover="" onmouseout="" title="Projekt Neues von der Homepage"> </a> </div> <div style="clear:both;"></div> </div> Zitieren
RastaROCKET Geschrieben 11. November 2008 Autor Geschrieben 11. November 2008 Ja, das sollte funktionieren, danke! Die Liste hatte ich ursprünglich hierfür gebraucht: Die Listen brauche ich, da ich eigentlich, bei Mousover über einem Subnavigationspunkt unter diesem, den Titel des aktuellen Kontext anzeigen wollte. Also z. B. so: Oder gibt es da ein elegatere Lösung? Hast du evtl. eine Idee? Ich bauch das nicht bei MousOver, aber wenn das Projekt aktiv ist sollte unter dem aktivem SubNavi-Punkt der Name des Projektes stehen. Wie mach ich das wenn das ganze dynamisch wächst? Kann da ja nicht mit Position absolute arbeiten. Vielen Dank schon mal! Gruß, Kristof Zitieren
Toothrot Geschrieben 12. November 2008 Geschrieben 12. November 2008 Ich würde versuchen, diese Div-Suppe mal zu entschlacken, das sieht ja schlimmer aus als ein Tabellen-Layout. Zitieren
bahtek Geschrieben 12. November 2008 Geschrieben 12. November 2008 Man könnte auch einfach mit position:absolute arbeiten wäre wohl am schnellsten gegangen. Zitieren
RastaROCKET Geschrieben 12. November 2008 Autor Geschrieben 12. November 2008 Div-Suppe, trifft es wohl recht gut . Hab mich bemüht es so sauber wie möglich zu machen, leider hat mich der Unterschiede in der Darstellung der gebräuchlichen Browsern dazu gezwungen es so aufzubauen. Mit position absolut kann ich nicht arbeiten, da die Seite dynamisch aus einem CMS entsteht. Ich weiss nie wie viele Projekte ich habe. Zitieren
M.A.Knapp Geschrieben 12. November 2008 Geschrieben 12. November 2008 (bearbeitet) ich hab da mal was gebastelt (verhält sich in IE und FF gleich ) <html> <body> <div style="text-align:center;" > <table style="margin-left:auto; margin-right:auto; table-layout:fixed" > <tr> <td style="width:32px; height:32px;" > <div style="width:32px; height:32px; background-color:#ff0000" onmouseover="this.firstChild.style.display='inline';" onmouseout="this.firstChild.style.display='none';" ><div style="display:none; position:relative; top:32px; font-size:x-large;" >ROT</div> </div> </td> <td style="width:32px; height:32px;"> <div style="width:32px; height:32px; background-color:#00ff00" onmouseover="this.firstChild.style.display='inline';" onmouseout="this.firstChild.style.display='none';" ><div style="display:none; position:relative; top:32px; font-size:x-large;" >GRÜN</div> </div> </td> <td style="width:32px; height:32px;"> <div style="width:32px; height:32px; background-color:#0000ff" onmouseover="this.firstChild.style.display='inline';" onmouseout="this.firstChild.style.display='none';" ><div style="display:none; position:relative; top:32px; font-size:x-large;" >BLAU</div> </div> </td> </tr> </table> </div> </body> </html> Bearbeitet 12. November 2008 von M.A.Knapp Zitieren
FMG Geschrieben 13. November 2008 Geschrieben 13. November 2008 ...leider hat mich der Unterschiede in der Darstellung der gebräuchlichen Browsern dazu gezwungen es so aufzubauen. Nun ja... Du lässt die Browser raten und wunderst dich, wenn sie es dann gnadenlos tun? Teile dem Browser mit, in welcher Sprache du mit ihm zu sprechen gedenkst, sprich füge erstmal einen passenden docType an und lasse die Seite dann erstmal validieren. Zu deinem Problem: Wenn du einen Listenpunkt (.subTitle) mit display:block formatierst und diesen Block dann floatet, fängst der erste Block wo an? Richtig, links... Pack deshalb die Subnavigation in eine richtige Liste, anstatt für jeden Menüpunkt eine neue Liste auf zu machen und formatiere den li-Tag dann mit display: inline; (ohne float!). Zitieren
Empfohlene Beiträge
Dein Kommentar
Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.