Making both buttons look the same

Illdy
1

Hi,

I have a site : www.seasidecouncil.com , where I am trying to make the left button (button 1) have the same fill and hover colour as the right button (button 2).

There doesn’t seem to be anywhere in the theme to change this, which is bit of a shame as you might not want differing buttons.

I know some CSS (I’m no expert) but I can’t quite get the left button to mimic the right button.

Any ideas? or some custom CSS I can drop in to the additional CSS area?

cheers

Sam

2

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

#header.header-front-page .bottom-header .header-button-one {
    color: #585858;
    background: white;
}
#header .bottom-header .header-button-one:hover {
   border-color: #e9d019;
}

Thanks!
Colorlib Support Team

3

Hi,

Thanks for the reply.

The only issue now is that the left button shows as a border on hover, when I’d like it to show as the yellow solid colour.

cheers

Sam

4

Hello there,

I hope you are doing well today.

Please try using the following CSS to remove the white border:


#header.header-front-page .bottom-header .header-button-one {
    border: none;
    background-color: #666666;
}

Best Regards,
Support

5

Hi,

Thanks for replies. A combination of both and a little tweak this end worked:

#header.header-front-page .bottom-header .header-button-one {
color: #585858;
background: white;
}

#header .bottom-header .header-button-one:hover {
border-color: #f1d204;
background-color: #f1d204 !important;
}

Now both buttons are white, and hover to yellow.

6

Hi, there

Nice, to hear your problem is fixed:) Now I will now close the topic and mark it as resolved.
Feel free to contact us again Thanks!