0

I'll provide you with the code, but it seems that I cant change color of any a or li in my document. Been trying to fix it for a while, had zero success. I even tried to style it inline. What I want is when I hover, the text should turn white. Any type of help would be greatly appreciated, been stuck here for a while.

Here's my pen. https://codepen.io/filipstev/pen/rNVQqyZ

P.S. This is my first forum post. Sorry if I didn't explain it correctly!

Filip
  • 25
  • 3
  • https://stackoverflow.com/questions/13233991/combine-after-with-hover – Mech Mar 26 '20 at 18:16
  • http://jsfiddle.net/6evFd/1/ – Mech Mar 26 '20 at 18:17
  • Your link color is being controlled by nav-link and you would change the color by adding your own style to nav-link. Or better yet, use a modifier if you can. Directly overriding the color would look like this .nav-link { color: #ff0000; }, the modifier would look something like .nav-link--red { color: #ff0000; }, but that would make more sense if you adopted the BEM model for CSS. – WTFranklin Mar 26 '20 at 18:19
  • Post a [mcve] in your question please. I'm pretty sure you saw a big, red warning about linking to jsFiddle without code in your question, and highlighting text as code isn't enough. If jsFiddle ever is down or goes away, then your question loses all value. – j08691 Mar 26 '20 at 18:20
  • 1
    you need one more rule targeting the actual element not the pseudo-element `.batn:hover { color:white !important; }` – Rainbow Mar 26 '20 at 18:22

1 Answers1

1

Hi maybe you can use hover instead of using after it is better to use if you are just changing the color all you need to do is put the class name lets its batn like in your case you can try batn:hoverc{color:black !important;}

hope this helps you solve your issue

Arsham
  • 141
  • 1
  • 9