Ondersteuning Volgende » CSS / opmaak vragen Volgende » Header image niet scherp (Twenty Fourteen)

  • De header image van mijn site wordt niet scherp getoond. De afbeelding is op mijn pc zelf wel scherp. Ik heb het idee dat het thema (twenty fourteen) de afbeelding resized, maar heb geen idee hoe dit op te lossen is.

    Alvast bedankt!

    De pagina waar ik hulp bij nodig heb: [log in om de link te zien]

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Moderator Jeroen Rotty

    (@jeroenrotty)

    Hoi @kram94,

    Gelijk op welke breedte van het scherm wordt de afbeelding op 100% breedte gezet. Je zou beter je logo als PNG opslaan en gewoon zwarte achtergrond maken.

    Dan een max-width inzetten van je effectieve breedte en dan komt dat goed.

    Jeroen

    Wat Jeroen zegt klopt. Je achtergrondafbeelding wordt uitgerekt tot 100%, zelfs al is die zelf niet zo groot op grote schermen.

    In je style.css wordt op dit moment dit gedaan. Om dit aan te passen dien je in je child theme de css aan te passen. Voeg onderaan je child style.css het volgende toe:

    #site-header { text-align: center; background: #000; }
    #site-header a img { width: auto !important; }

    De eerste regel centreert elementen in je header (de image is een inline element en kun je centreren met een text-align). Vervolgens zet je de achtergrondkleur op zwart (of andere kleur die matched met je afbeelding achtergrondkleur).

    De tweede regel forceert de automatische 100% breedte die je logo onscherp maakt. Door deze op auto te zetten zal die de breedte aanhouden die hij van origine heeft.

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)