Patrick: Probleme mit Ausrichtung

SELF-Forum

Probleme mit Ausrichtung

Patrick
– Informationen zu den Bewertungsregeln

Abend,

ich bin dabei, meine Vorstellung des Websitelayouts von einem vorhandenen Bild nach XHTML 1.0 Strict/CSS umzusetzen.

Hier das Ziel:
http://patrick-stoehr.de/design/studie.gif

Die Problemseite im Aufbau:
http://patrick-stoehr.de/design/ (Site)
http://patrick-stoehr.de/design/web.css (Stylesheet)

Folgende Probleme treten auf:

  • Das Menu wird nicht wie der Inhaltscontainer als Top, Main und Bottom im Ganzen dargestellt, sondern verteilt sich horizontal.
  • Das Content-Panel ist an der falschen Position. Mit float:middle verdeckt es aber den Header.

Sekundär, noch unwichtig:

  • Die Schrift wird über den schwarzen Rändern der Panels dargestellt. Logisch, ich habe auch keine anderen Anweisungen gegeben. Wie lauten sie?
  • Im Vorschaubild existiert eine schwarze Verbindung zwischen Menü und Content*. Wie positioniere ich diese, wenn ihre y-Stellung immer, say, 10px unter dem obersten Rand der Container sein soll?

Danke und Gruß
Patrick

PS: Bitte keine Menschelei über die "Webcam". Die Seite ist noch nicht öffentlich und ich brauchte einen Platzhalter. ;)

* = http://patrick-stoehr.de/design/images/connector.gif

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Probleme mit Ausrichtung

    Jörg Peschke Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo Patrick,

    Folgende Probleme treten auf:

    • Das Menu wird nicht wie der Inhaltscontainer als Top, Main und Bottom im Ganzen dargestellt, sondern verteilt sich horizontal.
    • Das Content-Panel ist an der falschen Position. Mit float:middle verdeckt es aber den Header.

    Du hast in jedem Teil deines menus (top, Main-Menu, Bottom) ein float: left stehen, dadurch verteilen die sich logischerweise alle nach rechts.
    Du könntest z.b. das ganze menu in ein Div packen, diesem ein float:left geben (damit der Main-Content brav nach rechts floatet) und die ganzen float: lefts im Menu selbst löschen.

    Sekundär, noch unwichtig:

    • Die Schrift wird über den schwarzen Rändern der Panels dargestellt. Logisch, ich habe auch keine anderen Anweisungen gegeben. Wie lauten sie?

    Gib dem "li" mal ein "margin-left: 10px" (oder so), sollte funktionieren (im Firefox DOM-Inspector tut es jedenfalls)

    Gruss,
    Joerg

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Probleme mit Ausrichtung

      Patrick
      – Informationen zu den Bewertungsregeln

      Abend,

      Danke für die Hilfe! In Firefox und Opera sieht die Seite nun perfekt aus. Leider weigert sich der Internet Explorer, ein halbwegs zufriedenstellendes Ergebnis herzustellen. Bevor ich den DOCTYPE, wie in SELFHTML beschrieben, um eine Zeile heruntersetzte durch das <?xml, sah die Seite aus, als ob ein Tornado über ihr gewütet hat.
      Nun klebt der gesamte Inhalt am linken Rand, das Content-Panel ist nach unten gerutscht und die Grafiken für die oberen Rahmen haben eine Lücke.

      Wie fixe ich all das, ohne die Darstellung für richtige Browser zu zerstören?

      Danke und Gruß
      Patrick, der am liebsten alle IE-Zombies aussperren würde.

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln