Support » CSS / opmaak vragen » Recent News – Titel Kleur verandert niet

  • Opgelost norra

    (@norra)


    Op onze website verandert de titel kleur van onze nieuwsberichten niet. Wat gek is, is dat ik in Custom CSS wel kan vinden wel functie hiervoor verantwoordelijk is, alleen reageert hij niet op de color maar wel bijvoorbeeld op size.

    .avontuur-custom.recent-news-wrapper .grid-title {
    color: #FFFFFF !important;
    font-size: 20px;

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

4 reacties aan het bekijken - 1 tot 4 (van in totaal 4)
  • Hoi Norra, dit komt omdat je de DIV eromheen een kleur geeft en niet de link zelf.

    Links (a href=””) hebben namelijk van zichzelf een kleur die je dient aan te spreken. Dit kun je doen door het volgende aan je CSS toe te voegen:

    .recent-news-wrapper .grid-title a { 
       color: white;
    }

    Qua best practice dien je ook de hover, active en focus state te definiëren:

    .recent-news-wrapper .grid-title a:hover,
    .recent-news-wrapper .grid-title a:focus,
    .recent-news-wrapper .grid-title a:active { 
       color: white;
       text-decoration: underline;
    
    }

    Hi Ruurddewind,

    Het werkte man geweldig! Om mijn eigen kennis een beetje bij te kunnen schaven:

    .recent-news-wrapper .grid-title a:hover,
    .recent-news-wrapper .grid-title a:focus,
    .recent-news-wrapper .grid-title a:active {
    color: white;
    text-decoration: underline;

    Wat heb ik met dit stukje aangepast?

    🙂 Leuk toch?

    Dit zijn zogeheten CSS pseudo elementen. In feite is dit met name om te voorkomen dat men zwarte text ziet als men over de link heen gaat met de muisaanwijzer (hover), er op klikt (active) of deze via toetsenbord selecteert (focus).

    Mocht je vraag beantwoord zijn, wil je het topic dan op ‘Opgelost’ zetten?

    Fijne dag!

    Top man, thanks 🙂

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