Navi zentrieren - Links bleibt ein Abstand

Trash

Erfahrenes Mitglied
Moin,
ich habe eine Navigation, die in einem DIV zentriert werden soll. Problem ist, dass irgendwie ein Restabstand auf der linken Seite entsteht, obwohl margin auf 0 steht. Wenn ich ein <div style="clear"both"></div> zwischen dem umschließenden Div und der Navigation mache, geht es, aber dann habe ich einen größeren horizontalen Abstand und das ist nicht sonderlich sauber.

Weiß jemand woran das liegt?

Danke

CSS:
Code:
.navigation {
	height:45px;
	padding-top:10px;
	border-left:1px solid #D5D6D7;
	border-right:1px solid #D5D6D7;
}

HTML:
Code:
<div class="navigation">
    <div style="display:table;margin:0 auto;">
       <ul style="display:table-row;">
       <?
       foreach ... {
       ?>
	    <li style="display:table-cell;">
	          bla
            </li>
       <?
       } //foreach
       ?>
      </ul>
   </div>
</div>
 
Hast du eventuell ein Padding in dem übergeordneten DIV?
Sonst würde mir da nur noch das unsichtbare Aufzählungszeichen einfallen...

Gruß
 
Moin,
nein, kein padding und list-style-type:none; ist bei <ul> auch eingestellt. Wie gesagt, wenn ich nach dem <div class="navigation"> vor dem
Div-table ein div mit clear:both einfüge, ist der Abstand im Anhang links weg, aber dadurch bekomme ich einen "Bruch" in das div und das Menü sitzt nicht mehr richtig in der Div-Box "Navigation".

Ich habe links komischerweise diesen Abstand. Wenn da ein padding/margin wäre, würde mir der Code-Explorer das anzeigen...siehe Anhang.
 

Anhänge

  • Bildschirmfoto 2011-12-09 um 21.58.20.png
    Bildschirmfoto 2011-12-09 um 21.58.20.png
    8,2 KB · Aufrufe: 43
Zuletzt bearbeitet:
Wenn ich der

Code:
<div style="display:table;margin:0 auto;">

ein float:left; hinzufüge ist der Abstand weg, aber dann sitzt die Box viel tiefer als gewünscht....
 
Ja, da sieht es genauso aus. Chrome/Firefox/Safari - alles auf Mac.

Wie bekomme ich es denn hin, dass float: keinen zusätzlichen Abstand nach oben/unten erzeugt?
 
Moin,
habs gelöst. Ganz oben saß ein
Code:
	<div id="head_stripe" class="head_stripe_inside">

und wenn ich dort display von "block" auf inline-block ändere, ist der Abstand weg. Ich finde das zwar etwas komisch, aber aus irgendeinem Grund macht block hier nicht nur einen Zeilenumbruch sondern wohl auch einen Abstand vor das nächste Element...
 
Zurück