Mozilla ignoriert margin-top?!

[Fabian St.]

Hi!

Leider ignoriert der Firefox auf meiner Seite die "margin-top:8px". Der hellgraue Kasten (id="main") soll 8px unter dem Menü (id="menu") erscheinen. Ich habe auch schon versucht, dem Menü margin-bottom:8px zuzuweisen, aber dass hilft auch nichts. Die Seite: http://www.fabi0312.s4.cybton.com/ (Über dem Menü kommt noch ein 100px hohes Banner).

Woran kann das liegen? Der Code ist validiert und ohne Fehler.

---------------------------------------------------------

Grüße,

Fabian St.

[Cheatah]

Hi,

Woran kann das liegen? Der Code ist validiert und ohne Fehler.

div { border:1px solid red !important; }

Ein bisschen Debugging wirkt manchmal Wunder. Du wirst sehen, dass sich Dein <ul> außerhalb des Flusses befindet - natürlich, eben dies hast Du ja durch float:left gesagt. Der obere Außenabstand ist da.

Cheatah

[Fabian St.]

Hi Cheatah!

div { border:1px solid red !important; }

Ja, hab' ich gemacht. Und ich kann feststellen, dass das Menü eben nicht in diesem Kasten, sondern nach unter verschoben ist.

Ein bisschen Debugging wirkt manchmal Wunder. Du wirst sehen, dass sich Dein <ul> außerhalb des Flusses befindet - natürlich, eben dies hast Du ja durch float:left gesagt. Der obere Außenabstand ist da.

Kannst du mir das vielleicht genauer erklären? Ich verstehe nicht ganz, was du meinst. Ich habe dem  __ #menu ul li ___ ein display:block und anschließend ein float:left zugewiesen, eben darum das eins nach dem anderen kommt. Was müsste ich verändern?

---------------------------------------------------------

Grüße,

Fabian St.

[Fabian St.]

Hi!

Könnte mir noch jemand ein Tipp geben, wie ich dieses margin-top Problem beheben könnte? Ich habe jetzt eine ganze Weile mit dem float umher probiert, aber keine Lösung gefunden :-(
---------------------------------------------------------

Grüße,

Fabian St.

[Cheatah]

Hi,

Könnte mir noch jemand ein Tipp geben, wie ich dieses margin-top Problem beheben könnte? Ich habe jetzt eine ganze Weile mit dem float umher probiert, aber keine Lösung gefunden :-(

kein Grund zu drängeln. Das Geheimnis ist, _ohne_ float "rumzuprobieren".

Cheatah

[Fabian St.]

Hi!

kein Grund zu drängeln. Das Geheimnis ist, _ohne_ float "rumzuprobieren".

Das habe ich natürlich auch schon versucht, aber dann kriege ich die einzelnen Menü-Items nicht nebeneinander __und__ jedes einzelne 100px breit. D.h. ich habe es auch schon mit display:inline; probiert aber dann sind die einzelnen Item nicht genau 100px breit, sondern nur so breit, wie es der Text verlangt. Gibt es dafür vielleicht eine Lösung?

---------------------------------------------------------

Grüße,

Fabian St.

[Cheatah]

Hi,

Das habe ich natürlich auch schon versucht, aber dann kriege ich die einzelnen Menü-Items nicht nebeneinander __und__ jedes einzelne 100px breit. D.h. ich habe es auch schon mit display:inline;

es gibt neben inline und block noch eine Menge anderer display-Eigenschaften, z.B. table-cell.

Cheatah

[Fabian St.]

Hallo!

es gibt neben inline und block noch eine Menge anderer display-Eigenschaften, z.B. table-cell.

Werds mir mal anschauen...

---------------------------------------------------------

Grüße,

Fabian St.

[hurz]

hallo,

Das habe ich natürlich auch schon versucht, aber dann kriege ich die einzelnen Menü-Items nicht nebeneinander __und__ jedes einzelne 100px breit. D.h. ich habe es auch schon mit display:inline; probiert aber dann sind die einzelnen Item nicht genau 100px breit, sondern nur so breit, wie es der Text verlangt. Gibt es dafür vielleicht eine Lösung?

hatte vor kurzem ein ähnliches problem. schau mal hier: [pref:t=81410&m=473653]. vielleicht hilft dir das ja weiter.

gruss,
hurz

[Fabian St.]

Hi!

hatte vor kurzem ein ähnliches problem. schau mal hier: [pref:t=81410&m=473653]. vielleicht hilft dir das ja weiter.

Ja, dein problem scheint meinem sehr zu ähneln, aber leider hast du ja auch keine Antwort auf das Problem bekommen, das die <ul> außerhalb des Navi-Containers ist, oder? Ich habe die ganze Zeit rumprobiert, aber ich krieg das mit dem float einfach net hin :(

---------------------------------------------------------

Grüße,

Fabian St.

[hurz]

hallo,

Ja, dein problem scheint meinem sehr zu ähneln, aber leider hast du ja auch keine Antwort auf das Problem bekommen, das die <ul> außerhalb des Navi-Containers ist, oder?

doch. mit entsprechender height-angabe für das äussere und margins für das innere element hats geklappt. nur such ich noch nach einer lösung ohne height-angabe.

gruss,
hurz

[Fabian St.]

Hi Hurz!

doch. mit entsprechender height-angabe für das äussere und margins für das innere element hats geklappt. nur such ich noch nach einer lösung ohne height-angabe.

Also du meist ich soll dem Menu-Container eine feste Höhe zuweisen (,die gleich der der einzelnen Items ist) und nun dem <ul> das gewünschte margin verpassen?

---------------------------------------------------------

Grüße,

Fabian St.

[Fabian St.]

Hi!

doch. mit entsprechender height-angabe für das äussere und margins für das innere element hats geklappt. nur such ich noch nach einer lösung ohne height-angabe.

_______ Super, Danke! Das hat funktioniert. __________

Man muss dem menu-cpntainer die Höhe des <ul> bzw. der <li> zuweisen und voilà!

---------------------------------------------------------

Grüße,

Fabian St.

[Thorsten Steffen]

Hi,

Leider ignoriert der Firefox auf meiner Seite die "margin-top:8px". Der hellgraue Kasten (id="main") soll 8px unter dem Menü (id="menu") erscheinen. Ich habe auch schon versucht, dem Menü margin-bottom:8px zuzuweisen, aber dass hilft auch nichts. Die Seite: http://www.fabi0312.s4.cybton.com/ (Über dem Menü kommt noch ein 100px hohes Banner).

Das Verhalten aus Firfox's Sicht logisch zu erklären würde mir auch schwer fallen ;)
Er bemisst den Abstand auf jeden Fall nicht zu deiner Navigationsleiste. Helfen würde zwar für den Firefox ein position:releative; top:8px; aber dann kommen neue Probs mit dem IE.

Woran kann das liegen? Der Code ist validiert und ohne Fehler.

Ändere deine li's von display:block; auf display:inline; und nimm das float raus, dieses ist der Kern des Übels für den Firefox.
Nutze vielmehr in deinen Links display:block; und übernimm die entsprechende Formatierung aus dem li in die Links. width:... etc

dann klappts auch mit dem Firefix :)

gruss
Thorsten

[Thorsten Steffen]

huch,

das Problem ist ja schon gelöst ^^
hatte glaube zunächst nur ne gecached Version, da fehlten paar Posts ^^
und es heisst natürlich Firefox :D

gruss
Thorsten

[Fabian St.]

Hi!

huch,

das Problem ist ja schon gelöst ^^
hatte glaube zunächst nur ne gecached Version, da fehlten paar Posts
und es heisst natürlich Firefox :D

Ja, das Problem ist bereits gelöst, aber trotzdem Danke! Ich werde mal probieren, ob deine Lösung auch funktioniert.

---------------------------------------------------------

Grüße,

Fabian St.