[Support request] Default CSS Styling for buttons

[Anthony]

Hi,

I am using a Child theme of GPP with a Plugin that outputs two buttons as below.

The button element gets a transparent 1px border from the below css. Whereas the A element does not.

I am guessing I can override this with custom CSS, but is there somewhere else where this default is set that should be addressed rather than adding extra CSS? I want to achieve that both As & Buttons look the same.

button, input[type=button], input[type=reset], input[type=submit] {
    background: #55555e;
    color: #fff;
    border: 1px solid transparent;
    cursor: pointer;
    -webkit-appearance: button;
    padding: 10px 20px;
}

<a href="OtherPage.html" class="button">Button #1</a>
<button type="submit" name="b2" value="submit>Button #2</button>

[David]

Hi there,

you will need to include the .button selector in your CSS eg.

a.button, button, input[type=button], input[type=reset], input[type=submit]

[Anthony]

Hi David,

Thank you for coming back so quickly.

I have not added the above CSS, it appears in the generated stylesheet that GP creates. Where do I find this to tweak it as indicated?

[Ying]

We know that CSS is from GP, as you are trying to override that CSS, what David suggested is you can use this selector a.button, button, input[type=button], input[type=reset], input[type=submit] to override GP’s CSS.

[Author]

Posts