Locus Responsive Layout - Bild oberhalb Header: Abstand und Position (​ZP V13)

  • Hallo ZP-Team,

    meine Homepage mit dem Locus-Layout wird immer noch schöner :)
    Zwei "Problemchen" habe ich noch:

    1.) Ich habe über der Kopfgrafik ein Logo eingefügt. Dieses ist 75Px hoch. Darüber und darunter ist ein relativ großer Abstand (ca. 50Px). Den hätte ich gerne auf 0 oder maximal 5 Px.

    2.) Dieses Logo verrutscht außerdem nach der Veröffentlichung bei der Anzeige im Browser etwas nach links, im ZP wird es noch korrekt zentriert angezeigt (siehe Anlagen).

    Danke für die Hilfe.

    Grüße

    Petra

  • Hallo,

    das Verrutschen können wir nur beurteilen, wenn Sie uns den Link zur Seite nennen. Was den Abstand anbelangt, schauen Sie sich mal folgenden Artikel an: Locus Responsive Layoutänderung

    Da Sie ja sehr viel per CSS anzupassen scheinen, wäre es sicher hilfreich für Sie, wenn Sie sich mal mit der Benutzung der Entwicklertools in den Browsern (z.B. Chrome) vertraut machen würden. Mit diesen Tools können Sie sehr komfortabel die aktuellen CSS-Einstellungen herausfinden und Änderungen live ausprobieren, die Sie dann nach erfolgreichem Test im Projekt einfügen können.

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

  • Hallo Herr Seiz,

    so, es nützt wohl nichts, ich habe mich in CSS reingewühlt:

    Abstände über und unter dem Logo sind nun korrigiert.

    Viele Grüße

    Petra

    3 Mal editiert, zuletzt von Lucretia (9. Januar 2017 um 20:46)

  • Evtl. könnten wir die Ursache für den Versatz ermitteln, wenn Sie uns die URL zur Seite nennen würden ;)

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

  • Juhu, mit dem CSS

    Code
    text-align: center

    bekomme ich die Zentrierung des Logos hin. Das Problem mit dem Versatz ist gelöst.

    Jetzt habe ich nur noch das Problem, dass auf mobilen Geräten dieses Logo oben winzig ist, obwohl es schön Platz hätte (siehe Anhänge). Ich bräuchte also einen CSS-Befehl, mit dem auch bei kleinem Bildschirm die Logogröße beibehalten wird:

    Problem ebenfalls gelöst: Das Logo war 1200 Pixel breit (mit Rand rechts und links), ich habe es jetzt 300Px breit gemacht - ohne Rand, denn zentriert wird es ja durch den "text-align: Center"-Befehl.

    Jetzt funzt es.

    Thema kann geschlossen werden. :)

    Grüße

    Petra

  • Logo-Bild -> mehr -> Einstellungen -> Inline-CSS:

    Code
    margin: -35px 0px -35px 0px;text-align: center;

    Bei mir hat es so geklappt, viel Erfolg!

    Gruß

    Lucretia

  • Jetzt stehe ich total auf dem Schlauch. Ich nutze Zeta 12.5. Muss ich die Einstellung unter "Einstellungen - CSS" machen? Oder wie komme ich zu dem von Ihnen beschriebenen Pfad?

    Danke

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!