mobile Theme Top Padding

Hi

div#header-image {
    margin-top: 50px;
}

Wenn du noch möchtest, das ganze in Media Query für Mobil.

http://www.elmastudio.de/wordpress/eige…-funktionierts/

P.S.: Dein favicon fehlt ....

Zitat von SimJim

Ich will ja nur den Title weiter nach unten verschieben. Das Bild wird ja korrekt angezeigt, da verwende ich ja schon margin

Tjaaa, wenn aber dein Seitentitel so angeordnet ist, dass er nur zur Hälfte über dem Bild steht und zur anderen Hälfte über dem Bild, dann braucht entweder dein Bild eben doch einen Rand nach oben. Oder du veränderst den negativen Rand nach oben von deiner h1-Überschrift.

#site-title {
    margin-left: 1.5% !important;
    margin-top: -3.75% !important;




}

Also 0 oder sogar ein kleiner positiver Wert statt -3.75%

Gruß
helix

Oh man was hier für Antworten gegeben werden. Einfach irgendeinen Beitrag zu verlinken in dem ungefähr was ähnliches steht hilft nicht wirklich was.

Der passende Code ist folgender:

Media (max-width: 767px) and (min-width: 581px)
#header {
margin-top: 90!important;
}

Media (max-width: 580px)
#header {
margin-top: 90!important;
}

Einfach so ins Custom CSS vom Child-Theme und fertig. Du kannst die beiden Codes auch zusammenfügen oder lässt es einfach so. Falls du noch ein Custom CSS brauchst: https://de.wordpress.org/plugins/simple-custom-css/

Dann gibst du nicht dem Bild selber den Rand, sondern dem Element, das in der größeren Ansicht sowieso schon einen Rand oder Abstand nach oben hat. Das ist

#header {
    margin-top: 90px;




}

Möglicherweise reicht es schon, wenn das auch in der entsprechenden Media Query auf den gleichen Wert gesetzt wird. Oder eben mal ausprobieren, mit welchem Wert es okay aussieht.

Gruß
helix

Ergänzung: _Pascal war schneller. Die Einheit px hinter den Wert würde ich trotzdem hinschreiben …

Zitat von helix

Ergänzung: _Pascal war schneller. Die Einheit px hinter den Wert würde ich trotzdem hinschreiben …

In dem Fall sollte es auch ohne px funktionieren.

Pack mal noch Klammern um die Media Querys, also so:

[COLOR=#333333] Media (max-width: 767px) and (min-width: 581px){[/COLOR]
[COLOR=#333333]#header {[/COLOR]
[COLOR=#333333]margin-top: 90!important;[/COLOR]
[COLOR=#333333]}
[/COLOR]}

[COLOR=#333333] Media (max-width: 580px){[/COLOR]
[COLOR=#333333]#header {[/COLOR]
[COLOR=#333333]margin-top: 90!important;[/COLOR]
[COLOR=#333333]}
}

Dann berichte nochmal.[/COLOR]

Sorry, wenn ich mich da jetzt einmische :)

90!important kann nicht klappen, da hast du die px im Eifer des Gefechtes vergessen pascal ;). Es ist ist in dem Fall auch ausreichend nur max-width: 767px anzugeben (vorausgesetzt dier Wert 90px war an beiden Stellen korrekt).

Also so:

[COLOR=#333333]
@media (max-width: 767px) {[/COLOR]
   [COLOR=#333333]#header {[/COLOR][COLOR=#333333][/COLOR]
     [COLOR=#333333]margin-top: 90px!important;[/COLOR]
   [COLOR=#333333]}
}[/COLOR]

Wo trägst du die CSS-Ergänzung denn ein SimJim?
Soweit ich gesehen habe, verwendest du JetPack, dort gibt es wohl eine custom.css. Die wäre der geeignete Ort dafür.