Changing text colour only on buttons

  • themuledigital · Member ·

    Hi Ana,

    Thanks for this theme, it’s proven really handy!

    My site has a white background and I want orange buttons with white text, but the only way to do that has been to change the text colour of all links in the CSS editor. However, this also then changes body links to be unreadable.

    Is there a way to make button links have a different colour to other links?

    The blog I need help with is: (visible only to logged in users)

  • anarieldesign · Theme Author ·

    Hi,

    thank you for using our theme.

    If you want to change buttons you can try and use this in the Custom CSS: 

    .button {
    background: #f7931d;
    color: #fff;
}

    If you need more help with, please make your website public to be able to help you further.

    All the best,
    Ana

  • themuledigital · Member ·

    Hi Ana,

    Thanks for getting back to me!

    I’ve made my site public as the CSS is still not working.

    The problem is that the text in the button is inheriting the theme link colour. So any colour I change to isn’t seen because the link colour is overriding the text colour.

    So is there a way to stop the button link text from inheriting the theme’s link colour?

    Thanks,
    George

  • anarieldesign · Theme Author ·

    Hi George,

    I just checked your website and it seems your buttons have the white color text and it looks ok. Do you still need help with?

    All the best,
    Ana

  • themuledigital · Member ·

    Hi Ana,

    Thanks again for getting back to me. I managed to change the button links to white using this:

    
.button.a, a:active, a:focus, a:visited, #promo a, .block-one .no-featured-image .entry-content a, .block-two .news .entry-content a, .blog .entry-meta a:hover, .search .entry-meta a:hover {
	color: #fff;
}

    This, for the most part, does the job, but I feel like it’s probably painting a much too broad brush – what would I use to change (for example) the hover colour of links?

    Apologies, I have a lot to learn with CSS!

    Thanks,
    George

  • anarieldesign · Theme Author ·

    Hi George,

    you’ll need to add :hover selector: https://www.w3schools.com/cssref/sel_hover.asp

    Hope this helps.

    All the best,
    Ana

  • The topic ‘Changing text colour only on buttons’ is closed to new replies.