Custom Code for read more and category

Posted in: Newspaper
Post count: 23

Hi there,

I found this wonderfull tutorial ( https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/) makes me feel i know codes haha
Anyway, i have been playing around and made a few changes. But i can’t seem to change the hover effect.
Can you assist?

This is the code i made up trough the tutorial :

.td-read-more a, .more-link-wrap a {
background-color: #ffffff;
color: #000000;
border: 1px solid #000;
display: inline-block;
font-size: 13px;
letter-spacing: 2px;
font-weight: 500;
line-height: 1;
padding: 10px 15px;
-webkit-transition: background-color 0.4s;
-moz-transition: background-color 0.4s;
-o-transition: background-color 0.4s;
transition: background-color 0.4s;

}
.td-read-more a:hover {
color: #fff;
}

.td-excerpt {
text-align: left;
}

.td-post-category {
display: inline-block;
padding-left: 0;
text-transform: uppercase;
background-color: #ffffff;
color: #bf9f5a;
letter-spacing: 2px;
font-size: 11px;

}

You can visit my website to see what it does now : http://www.serinawilliams.nl
The category’s are the right color but when you hover it turns black. I wan’t to stay as it is when you don’t hover.
The ” Lees meer / Read more ” button goes black but i would like it to stay as it is when you don’t hover.

please correct me if necessary,i am very new to CSS.

Post count: 20688

Hi,

You can try the code provided below, it will make the Read more buttons and the category tags remain the same, when hovered. All you need to do is remove the code you currently have on the Read more button hover
https://www.screencast.com/t/akn9BQOjLL5P
And then enter this one. Please let me know if this is not working properly for you, or you wanted something else.

.td-post-category:hover,
.td-read-more a:hover {
background-color: #fff!important;
}

Thanks

Post count: 23

Yes this worked! Thank you so much for helping!

Viewing 3 posts - 1 through 3 (of 3 total)
The forum ‘Newspaper’ is closed to new topics and replies.