Antworten zum Thema „Clearfix, wie mache ich das am besten?“

[monst3r]

Hallo!

Wie ihr auf der seht, gibt es da irgendwie ein Problem mit dem floaten.

Auf dem Screenshot..



soll das "Zum" bei 1 zu der anderen 1. Dann soll darunter bzw. daneben der Facebook Button. Muss ich da irgendetwas mit clearfix machen?
Wenn ja, wie macht man das am besten?
Irgendwie bin ich zu blöd dafür.

Kann mir einer helfen?

Gr

 

[fexx]

AW: Clearfix, wie mache ich das am besten?

warum löst du das nicht mit 2 divs?

div eins (float left):
kontakt, telefon, routenplaner, facebook, etc.

div zwei (float left):
kontaktforumular

und danach dann clearen

 

[monst3r]

AW: Clearfix, wie mache ich das am besten?

Hallo!

Ich habe jetzt ein "linken", "rechten" und ein "unten" div angelegt.
Den linken und rechten eine höhe, breite und ein float left/right gegeben.
Das funktioniert ja schon mal.

Nun möchte ich noch die zwei restlichen Sachen, facebook und routenplaner nebeneinander, zentriert unter den Boxen unten links und rechts ausrichten.
Warum ist denn das Kontaktformular nicht Bündig mit der linken Box?

Und wie stellt man das am besten an?
Wie soll ich das am besten mit dem clear machen?
Einfach dem letzten div Element ein clear:both mitgeben oder extra ein div oder class clearfix anlegen?

Was noch komisch ist, im Safari und Google Crome werden die Menüs unter "Leistungen" in den Footer gedrückt. Woran kann das liegen?

Edit: Das unter Leistungen habe ich mit einem einfachen <br/> wegbekommen.

gr

 

[smith_design]

AW: Clearfix, wie mache ich das am besten?

Hej!

Um Content von Footer zu trennen, setze ich entweder nach dem letzten Element vom Inhaltsblock oder im Footer selbst (Elternelement, falls mehrere DIVs im Footer herumlungern...) clear:both; ein.

Theoretisch müsstest Du auch nicht beide Elemente, #links und #rechts mit float ausstatten; lass z.B. bei #rechts das float raus und setze statt dessen

padding-left: 400px;

ein.
Der Effekt ist derselbe.

Aber das ist eher Kosmetik, ich glaube nicht, dass es Dir beim Problem mit Chrome oder Safari helfen würde...
Grüßle
Michael

 

[monst3r]

AW: Clearfix, wie mache ich das am besten?

Hallo!

Ok, das mit dem padding hat geklappt. Sind jetzt auf einer Höhe.
Nun geht es unten ran.
Komisch, warum wird der "unten" div nicht im Style angezeigt?


Gr

 

[smith_design]

AW: Clearfix, wie mache ich das am besten?

Hmm...

Warum, weiß ich nicht.
Persönlich bin ich zu faul 'div'#... zu tippen, bei mir ist das immer nur
? .div_klassen_name
oder
? #div_id_name

Firefox erkennt ~ 30 Fehler im CSS, evtl. liegt's daran (konnte ich aber nicht konkretes, markantes finden, z.B. fehlendes ';'). Der Rest sind hauptsächlich Font Fehler, etwa bei @font-face - ich dachte immer der Aufbau wäre

@font-face { Anweisungen...}
//Deine Zeilen z.B.
@font-face {{ Anweisungen...}}

Validatoren für CSS empfehle ich normalerweise nicht, und finde sie eigentlich Quatsch, für HTML und XHTML andererseits finde ich sie persönlich unverzichtbar.

Trotzdem könntest Du mit dem W3C-Validator mal den einen oder anderen Fehler entfernen und schauen ob's dann besser geht (die finden immerhin 93 Fehler im CSS):

Wie final ist das Projekt eigentlich schon?
Vielleicht magst Du auch noch mal mit dem HTML-Validator draufschauen (19 Fehler): W3C-XHTML-Validator
Beim »XHTML STRICT« sollte es schon weitgehend passen. Ob man wirklich Hyperlinks im neuen Fenster unbedingt mittels JS lösen muss, nur um valide zu bleiben, mag jeder selbst entscheiden. Weniger Fehler bedeutet für mich aber immer gleich höhere Kompatibilität - vielleicht klappt's dann auch mit Chrome...
Guats Nächtle

P.S.: Bitte nicht krumm nehmen, soll kein Vorwurf sein!
Aber wenn (X)HTML-Fehler und CSS-Fehler zusammenkommen, kann es schonmal sein, dass der eine oder andere Browser etwas ignoriert und z.B. eine komplette DIV-Anweisung falsch interpretiert. Sollte nur konstruktive Fehlersuchhilfe sein

 

[monst3r]

AW: Clearfix, wie mache ich das am besten?

Hallo!

Also warum die unten Box nicht angezeigt wurde hatte folgenden Grund.
Eine "{" Klammer war verkehrt herum gesetzt. Somit wurde der nachfolgende CSS Code im Ablauf unterbrochen. :hmpf:

Die Fehler im XHTML/CSS sind hauptsächlich die CSS 3 Angaben für Schatten und Radius sowie die Google Font Apis.

Also nicht so schlimm.

Gr

 

[smith_design]

AW: Clearfix, wie mache ich das am besten?

Ooops!
Das hab ich wohl übersehen... Naja, war auch nicht mehr ganz früh am Tage :müde: