Header-Bild in Twenty-Fourteen Design zentrieren

  • Hallo zusammen, bin Neuling und verwende wordpress erst seit ein paar Wochen. Ich nutze die Version 3.9.2 und das Theme Twenty-Fourteen. Dieses Theme habe ich wie folgt geändert:
    .site {
    background-color: #fff;
    max-width: 100%;
    position: relative;
    }
    Nun nutzt die Seite den vollen Bildschirm Bereich.

    sowie

    .site-header {
    background-color: #000;
    max-width: 100%;
    position: relative;
    width: 100%;
    z-index: 4;

    für den Header

    und
    .site-content .entry-content,
    .site-content .entry-summary,
    .site-content .entry-meta,
    .page-content {
    margin: 0 auto;
    max-width: 1000px;
    }

    für die Containerbreite.

    Wenn ich nun über die Design-Anpsassung ein Headerbild verwende, "klebt" dieses am linken Rand. Wie kann ich das Logo zentrieren?
    Habe mir jetzt so geholfen, dass ich in jede Seite im "Textfeld" das Logo eingefügt habe - würde natürlich lieber die Headerfunktion nutzen.

    URL der Seite (ohne Headerbild): http://www.kzv-h507.de

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Hallo

    Code
    #site-header a img {
    display: block;
    margin: 0 auto;
    }

    Das zentriert das Headerbild!
    Wobei ich es persönlich schöner finde, wenn das Bild über die gesamte Breite gestreckt wird:

    CSS
    #site-header a img {
    display: block;
    width: 100%!important;
    height: auto!important;

    LG, pixselig

    PS: für das Headerbild welches über die ganze Breite geht würde ich es eventuell nochmals in einer etwas höheren Auflösung hochladen. Und nicht im GIF-Format sondern als JPG oder PNG.

Jetzt mitmachen!

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