CSS kleur tekst blog werkt niet

Status
Niet open voor verdere reacties.
femke98

femke98

Meubilair
Lid geworden
16 dec 2006
Berichten
6.921
Hallo,
Ik had op een website bij extra CSS de kleur van de tekst voor het bloggedeelte aangepast.
Na de verhuizing van de website werkt dit niet meer en krijg ik het ook niet meer goed.

De code is nu:
Code: 
a{
color:#C59B58!important;
}
a:hover {
color: #202a54;
text-decoration: underline;
}

De website is sinterklaaskrullen.nl
en dan gaat het om het blog: https://www.sinterklaaskrullen.nl/blog/

Ik doe het nu handmatig, dus de kleur die ik wil hebben voor het blog is oké.
Maar maak ik een nieuwe blog dan is de kleur niet de kleur #202a54; maar de standaard.
Ik krijg het met geen mogelijkheid in orde.

Wie helpt?
 
Als ik de kleurcodes in een paint programma zet dan is C59B58 licht oranje en 202a54 donker blauw (de laatste werkt niet). In css heb je te maken met prioriteiten. In het algemeen: hoe specifieker je iets selecteert, des te hoger is de prioriteit. Voorbeelden van boven naar beneden een steeds hogere prioriteit.
Code: 
a { ... }
.style-116 a { ... }
.main-section .style-116 a { ... }
.main-section div.style-116 a { ... }
#cc-window .main-section div.style-116 a { ... }

Als je ergens !important achter een eigenschap zet dan zit je op de hoogste prioriteit.
Gebruik dit alleen als je zeker weet dat het geen invloed heeft op andere delen in je website en als er geen andere oplossing is.
 
Code: 
a{
color:#C59B58;
}
a:hover {
color: #202a54;!important
text-decoration: underline;
}

dus als ik important bij 202a54 zet moet het werken?
Maar het gekke is dat als ik een nieuwe pagina maak, deze wel de kleur krijgt die hij moet krijgen.
Dus er gaat iets niet goed met het thema inderdaad het css gebeuren werkt niet goed.

Oh wacht, die css van mij geeft aan dat de kleur 202a54 underline is en niet de kleur van het blog tekst.
Heb ik dat juist?
Edit: ja, dat heb ik juist. Met de code hierboven wordt de tekst blauw onderlijnd en de hoover wordt ook blauw.

Dat is niet wat ik wilde, ja.....dat ook. Dus ik haalde even 2 dingen door elkaar.

Hoe maak ik de tekst alleen van de blogberichten automatisch die 202a54?
 
Laatst bewerkt:
femke98 zei:
Code: 
a{
Ik snap trouwens niet waarom het opeens niet meer werkt na verhuizing.[/QUOTE]
Heb je nog de oude locatie online staan? Dan zou je ergens een afwijking moeten vinden.
Misschien een nieuwe versie van een plug-in met aangepaste CSS-code, om maar iets te noemen?
Klik om te vergroten...
 
Nee PHP4U, dat heb ik niet.

Maar eh... ik heb mijn eerdere bericht even aangepast, ik zie dat ik zelf de fout inga.
Maar wil nog steeds wel weten hoe ik automatisch mijn tekst van de blogberichten blauw 202a54 worden zonder dat ik dat zelf hoef aan te passen met aangepaste kleur (want dat is natuurlijk elke keer weg).
 
In vereenvoudigde vorm kan je de prioriteit zo bepalen.
Code: 
Het aantal (pseudo)[B]elementen[/B] x   1
Het aantal (pseudo)[B]classes[/B]   x  10
Het aantal [B]ID's[/B]              x 100

* { ... } telt voor 0 mee.
!important heeft de hoogste prioriteit.
Bij gelijke prioriteit wint de laatste.

Code: 
div.myblog .menu li { ... }  prioriteit: 11 + 10 + 1 = 22
.item.blue .blog3 a { ... }  prioriteit: 20 + 10 + 1 = 31
 
Hoe maak ik de tekst alleen van de blogberichten automatisch die 202a54?
Klik om te vergroten...

In de html ga je omhoog tot je een "ouder" tegenkomt.
Op die manier kan je de css specifieker maken, dus een hogere prioriteit geven.

Bijvoorbeeld de "Lees meer" tekst
Code: 
.h-x-container a.h-button { ... }
.h-x-container a.h-button:hover { ... }

Welke linkjes of teksten bedoel je precies met "blog teksten"
 
Laatst bewerkt:
Als ik de ouders bekijk van de blog titel
Code: 
div class="h-blog-meta style-117 style-local-19-m9 position-relative h-element"
  div class="h-blog-title style-118 style-local-19-m10 position-relative h-element"
    div class="h-global-transition-all"
      a
        h4.colibri-word-wrap

Dan kan je misschien dit in je css gebruiken
Code: 
.h-blog-meta .h-blog-title a {
    color: #202a54;
    text-decoration: none;
 }
 .h-blog-meta .h-blog-title a:hover {
    color: #C59B58;
    text-decoration: underline;
 }
 
Laatst bewerkt:
Welke linkjes of teksten bedoel je precies met "blog teksten"
Klik om te vergroten...
Als ik een nieuw bericht maak dan wordt de tekst zwart/grijd.
Maar dat wil ik automatisch naar #202a54

Nu moet ik het handmatig doen, maar wordt bij het aanpassen van de kleur die code weer verwijderd als je alles sluit.

De code die ik al in CSS heb is voor de linken die een andere lkeur krijgen als ze er overheen gaan met de muis of er op klikken. (ik dacht eerst dat het om de kleur ging van de teksten van nieuwe berichten)
 
De code die ik al in CSS heb is voor de linken die een andere lkeur krijgen als ze er overheen gaan met de muis of er op klikken.
Klik om te vergroten...
Je hebt a:hover { ... } gebruikt waarvan ik zeker weet dat andere css regels dit overrulen. Waarom ik hier zeker van ben? a:hover heeft de allerlaagste prioriteit in de hele css stylesheet. Ik gaf hierboven al aan, als ergens in de css .h-blog-title a:hover { ... } staat dan hebben jouw aanpassingen geen effect meer.

Maar je vraag, dat het alleen bij nieuwe posts het geval is komt (denk ik) door een "standaard css" regel die ergens in de stylesheet staat. Zoekplaatje dus :(
 
ja, had al gekeken hoor in de style.css maar dat is bij dit thema geen doen.

Dus als ik een nieuw blog bericht maak dan zal ik handmatig de kleur moeten aanwijzen die ik wil.

De code de je eerder gaf
Code: 
.h-blog-meta .h-blog-title a {
    color: #202a54;
    text-decoration: none;
 }
 .h-blog-meta .h-blog-title a:hover {
    color: #C59B58;
    text-decoration: underline;
 }

heeft dan weinig zin denk ik dan. Of?
 
Heb je een linkje van een nieuw test blog waarbij je niets aan kleuren hebt aangepast?
Gaat het om alle linkjes in de blog samenvatting (op de home pagina) of om alle linkjes in het volledige blog item?

aanvuliing
Ik zie overal "colibri" zoals bij <body id="colibri">
Een id is krachtig met hoge prioriteit. Probeer dit eens voor de home pagina:
Code: 
#colibri #blog-posts a,
#colibri #blog-posts a:focus {
    color: #c59b58;
    text-decoration: none;
}
#colibri #blog-posts a:hover,
#colibri #blog-posts a:active {
    color: #202a54;
    text-decoration: underline;
}

en voor het complete blog item op een blog pagina
Code: 
#colibri #blog-post a,
#colibri #blog-post a:focus {
    color: #c59b58;
    text-decoration: none;
}
#colibri #blog-post a:hover,
#colibri #blog-post a:active {
    color: #202a54;
    text-decoration: underline;
}

De plek waar je nu jouw css aanpassing hebt staan is oke! Die kan je vervangen door deze css.
 
Laatst bewerkt:
Laatst bewerkt:
oh jeetje, ben ik zo onduidelijk geweest? Het gaat om de tekst!
Mijn excuus hiervoor.

In mijn eerste bericht/vraag staat:
Ik doe het nu handmatig, dus de kleur die ik wil hebben voor het blog is oké.
Maar maak ik een nieuwe blog dan is de kleur niet de kleur #202a54; maar de standaard.
Ik krijg het met geen mogelijkheid in orde.
Klik om te vergroten...

Verder ben ik zelf in de war geweest met de css die er al instond, en dat heb ik aangegeven in bericht #5
https://www.helpmij.nl/forum/showth...g-werkt-niet?p=6267154&viewfull=1#post6267154

test bericht: https://www.sinterklaaskrullen.nl/test-bericht/
 
Laatst bewerkt:
Maar wil nog steeds wel weten hoe ik automatisch mijn tekst van de blogberichten blauw 202a54 worden zonder dat ik dat zelf hoef aan te passen
Klik om te vergroten...
Oeps, dat heb ik niet opgepikt. Ik zat in een tunnel met de css die je hebt opgegeven a {} en a:hover {}
Post #14 kan je misschien toch gebruiken, maar dan in afgeslankte vorm
Code: 
/* blog op home pagina */
#blog-posts {
    color: #202a54;
}
/* blog-item op blog pagina */
#blog-post {
    color: #202a54;
}

Of eventueel
#colibri #blog-posts {...}
#colibri #blog-post {...}
 
hahaha, kan gebeuren. Soms ben ik niet zo heel duidelijk, soms wel.

Ik ga het proberen, je hoort nog van mij!
Alvast dank Bron!!
 
Ergens anders in de stylesheets staat vermoedelijk een !important die het nu erg lastig maakt. Daarom moet hier zelfs tot op het allerlaatste <p> niveau een !important worden gebruikt. Zie mijn opmerking ergens hierboven dat !important in stylesheets vaak problemen kan geven zoals nu het geval is.

Dit lijkt te werken...
Code: 
#blog-post .colibri-post-content p {
    color: #202a54 !important;
}
 
Laatst bewerkt:
ah, ik ga deze erbij zetten. Ben benieuwd!

Edit: JAAAAAAAAAAAAA!!!!!!!!!!

Mijn code is nu:
Code: 
a{
color:#C59B58!important;
}
a:hover {
color: #202a54;
text-decoration: underline;
}

Code: 
#blog-post .colibri-post-content p {
    color: #202a54 !important;
}

Alles is nu zoals ik het wil! Super, ben zo blij!

Ik heb nog een website met colibri, en daar kan ik dus nu ook de blogposten een andere kleur geven.

Ik ben een blij mens. Dank je wel Bron!
 
Laatst bewerkt:
Graag gedaan, ho-ho-ho ;) groeten van de kerstman
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan