Hallo,

jetzt habe ich ein Fehler im LAyout, und komme nicht auf den Bug.

Es sollte so aussehen:

und es sieht so aus: Unbenanntes Dokument

Hallo,

da hättest du wohl gleich in deinem vorigen Beitrag bleiben können.

Wenn Elemente gefloatet werden und deren Inhalt sich dann außerhalb dieser Elemente befinden, sind sie in der Regel nicht korrekt gecleart worden. Das musst du also überprüfen.

Zudem solltest du nur dann floaten, wenn es auch notwendig ist.

Nebenbei: Das die Seite für einen gewerblichen Auftritt nix taugt ist dir schon klar?

Gruss

MrMurphy

Hallo, danke für dein Reply. Ich hab eigentlich alle anderen folgenden Elemente gecleared, dennoch ist es so. Wie bekomme ich sonst die divs nebeneinander ohne zu floaten? Und warum taugt die Seite nicht für einen gewerblichen Auftritt?

Hallo

Genau den Eindruck macht deine Seite. Du musst gezielt clearen, nicht einfach ein paar nachfolgende Elemente rauspicken in der Hoffnung "Wird schon passen".

Du musst also genau verfolgen, welche Elemente zu einem bestimmten float gehören und musst genau für diese Elemente dann gezielt ein clear setzen.

Weiterhin solltest du nur floaten, wenn es auch erforderlich ist. Innerhalb des footers sehe ich zum Beispiel keinen Sinn für ein float. Dieses float ist aber eine der Gründe, warum der Inhalt des footers außerhalb herumschwirrt, sich nach links bewegen will und dann an der Navi "hängenbleibt".

Dir scheint auch noch nicht bewußt zu sein, das gefloatete Elemente aus ihrer Umgebung (dem Textfluss, wie es wohl auch genannt wird) herausgenommen werden, bzw. was das überhaupt bedeutet.

Da du im content und im footer alle Elemente floatest haben die praktisch keinen Inhalt mehr. Entsprechend benötigen die auch keine Höhe mehr, die Folgen sind auf deiner Seite zu sehen.

Du kannst du natürlich gerne floaten - nur solltest du wissen was du tust.

Genau wie das frührere Tabellenlayout ist das floaten nur ein Hilfsmittel, weil es in HTML / CSS keine besseren Möglichkeiten zu Gestaltung gab. Vielen Profis ist das floaten so in Fleisch und Blut übergegangen, das ihnen das gar nicht mehr bewußt ist.

Eine andere Möglichkeit ohne float wäre zum Beispiel "display: table", wobei auch das im Endeffekt nur ein Hilfskonstrukt ist

Aktuell und speziell für das Layout entwickelt ist hingegen das Flexbox-Modell ("display: flex"). Entsprechend fallen auch viele Fehlerquellen weg. Wenn du eine neue zukunftssichere Seite erstellen willst solltest du also zum HTML5, CSS3 und Flexbox greifen. Kost nix, hat nur Vorteile.

Die Frage ist am schwierigsten zu beantworten, da sie von dir das größte Umdenken erfordert. Und du erfahrungsgemäß Ausreden ohne Ende finden wirst um Deine Seite zu verteidigen. Auch wenn diese Ausreden keinen einzigen Kunden bringen.

Kurz: Du erstellst die Seite nur für einen Menschen - für Dich. Die Wünsche der Kunden interessieren dich nicht.

Warum um alles in Welt sollte die Seite also Kunden anlocken?

Nur mal zwei praktische Infos dazu:

Info 1

Welche Geräte benutzen deine Kunden, wenn sie nach Nahrung suchen, die du anbietest?

Über 60 Prozent aller User sind im Internet mit Tablets und Smartphones unterwegs - mit noch immer deutlich steigender Tendenz.

Meine Beobachtung ist zudem, das in einer Runde, die ein Restaurant sucht oder Essen bestellen möchte, fast nur noch das Smartphone benutzt wird. So gut wie niemand fährt dazu noch seinen Desktop-Rechner hoch. In der Zeit haben die anderen bereits entschieden. Die Kunden, die du erreichen willst, werden also zu mehr als 80% ein Smartphone benutzen.

Und schau deine Seite mal kritisch auf einem Smartphone an - oder besser, lass dies mehrere neutrale Dritte tun. Dort ist die Seite schlicht unbenutzbar. Und die besser les- und bedienbare Homepage der Konkurrenz ist nur einen Klick entfernt.

Info 2

Schau dir mal deine Texte an. Jede Farbkombination ausser schwarz auf weiß erschwert das Lesen schon mal grundsätzlich.

Dann hälst du zusätzlich die Schrift noch sehr klein, so das sie selbst in einem großen Fenster für viele Kunden schwer zu lesen sind.

Und als zusätzliche Krönung bietest du auch noch Text vor Hintergrundbildern - der Supergau der Lesbarkeit.

Frage deine Testpersonen zum Beispiel auch mal an einem großen Monitor, wie angenehm die Texte für sie zu lesen sind? Als vergleich kannst du ihnen deine Seite ja ohne jegliches CSS vorsetzen:

HTML5: codex - Layout

Vielleicht merkst du auch selbst, wie dein Layout die Lesbarkeit erschwert.

Ende der Infos

So ließe sich das noch fast beleibig fortführen.

Lauter Belege, das DU die Seite nach DEINEN Vorstellungen und DEINEM veralteten Kenntnisstand erstellst - DU BIST DER KÖNIG.

Bleibt die Frage: Welche Rolle spielt in diesem, deinem Internetweltbild, der Kunde?

Gruss

MrMurphy