bei meinem WordPress Theme wurde das Header-Bild optisch im Body-Bereich angezeigt. Es sollte eigentlich neben „vierzweidrei.de“ und „Ganzheitlich über Medien reden“ stehen.

Dank einger Hilfe konnte ich den CSS Code zusammen bekommen, dass das Bild an der richtigen Stelle sitzt und sich auf Smartphones (und anderen kleinen Bildschirmen) an die richtige Stelle verschiebt.

/* Header */
.site-header {
	padding: 24px 0;
	padding: 1.714285714rem 0;
	position: relative; /* zeile hinzugefuegt */
}
/*hinzugefuegt anfang */
.site-header hgroup {
	padding-left: 140px; /* Logobreite + etwa 40px Abstand */
}
.site-header > a {
	position: absolute;
	top: 0;
	left: 0;
}

/*Abstaende header-image*/
.header-image {
	margin-top: 10px;
	margin-top: 0.625rem;
}
@media screen and (max-width: 599px) {
	.site-header {
		display: flex;
		flex-direction: column;
		float: none;
	}
	.site-header hgroup {
		order: 2;
		float: none;
		padding: 0;
	}
	.site-header .main-navigation {
		order: 3;
	}
	.site-header > a {
		order: 1;
		position: relative;
		text-align: center;
		margin: 0 auto 12px auto;
		/* 12px (dritter Wert) = Abstand nach unten zum Titel */
	}
}