• Hello Together,

    on my website, the header image was on the wrong place. It looked like the header-image is in the body.

    I fixed it, with help from a company.
    And i wanna share the result.

    If you add this css code into the Customizer, you will get the header image on the right place and it change his position for small screens like smartphones.

    Greets Thoys1

    /* 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 */
    	}
    }
    
  • The topic ‘Header Picture is on the wrong Place’ is closed to new replies.