'READ MORE' button different from search results

Hi,

‘READ MORE’ button differs in search result and other pages. I want to use the button in the search results for other pages like home, categories and tags.

(I attach the screen shots.)

How can I unify them? Do I edit the style.css?

Thank you always for your support!

Hi there

Hope you are having a good day and thank you for your question
In order to check your question i need to see your live website, please provide url and i will take a look

Hi,

Thank you for your help!

This is my website:
http://fourleafsound.com/blog/

And the search result page is:
http://fourleafsound.com/blog/?s=music&submit=Search

I’d like to use the “read-more” button in the search result…

hey there

Hope you are having a good day and thank you for your question :slight_smile:
Please add this CSS in appearance - customize - additional CSS

.btn {
    padding: 15px 80px;
    text-transform: uppercase;
    margin: 0 auto;
    width: 230px;
}

Thanks!
Colorlib Support Team

Hi,

Thanks for your help again!

I used it, but it kind of messes up the seach button…I instead edited the “read-more” button in the style sheet to look like the search result pages’s. But now, I have another problem…

The read-more button for the seach result has 100% length and it looks a bit different from the landing page’s. Is there a way to make it the same as other pages?

Thank you again!

HI

You have to use this css:

.btn {
margin: 0 auto !important;
width: 230px !important;
}

Thanks again!

This code, ".btn " is affective for other buttons like “search” button for the search bar…
Is there another way?

I also noticed the same differences between blog and search results (see attached images).

Hello there,

I hope you are doing well today.

Some of the buttons share the same CSS class so the changes made to one will affect the other, that is coded into the theme.

You can use this CSS to change the button in the search results but it would affect any other buttons that have the same button css being used:


.btn-default{
margin: 0 auto !important;
width: 230px !important;
}

Best Regards,
Support