Header image verandert grootte

  • Opgelost TictaCNL

    (@tictacnl)


    10 jaren, 2 maanden geleden

    Ha,

    Als ik de breedte van mijn browser verklein schiet mijn header image naar een kleinere versie van de afbeelding. Weet iemand hoe ik dit uit kan zetten?

    Het rare is, op de testomgeving van de website doet de header dit niet, maar op de werkelijke omgeving van de website schiet de header wel naar een kleinere versie. Je kunt het simuleren doe je de breedte van je browser kleiner te slepen.

    De website waar de header verschiet: website

    Hier werkt hij gewoon normaal: website
    Thanks!

1 reactie aan het bekijken (van in totaal 1)
  • marcelvanderhoek

    (@marcelvanderhoek)

    10 jaren, 2 maanden geleden

    Dat komt door het stukje CSS dat bovenaan de pagina geladen wordt: 

    <style type="text/css" id="twentythirteen-header-css">
			.site-header {
			background: url(http://www.maartenvanaes.nl/wp-content/uploads/2014/10/header.jpg) no-repeat scroll top;
			background-size: 1600px auto;
		}
		@media (max-width: 767px) {
			.site-header {
				background-size: 768px auto;
			}
		}
		@media (max-width: 359px) {
			.site-header {
				background-size: 360px auto;
			}
		}
			.site-title,
		.site-description {
			color: #524e4a;
		}
		</style>

    Hiermee wordt de afmeting van de achtergrondafbeelding van de header verkleind op twee momenten: als de viewport kleiner wordt dan 768px, en vervolgens als de viewport kleiner wordt dan 360px. Als je dit stukje CSS weghaalt zal dat niet meer gebeuren.

    Waarvandaan de CSS geladen wordt kan ik je zo niet vertellen, daar zul je even naar moeten zoeken.

1 reactie aan het bekijken (van in totaal 1)
  • Het onderwerp ‘Header image verandert grootte’ is gesloten voor nieuwe reacties.