user3304104 user3304104 - 1 year ago 82
CSS Question

Plain Button With Padding

The following CSS apparently results in the following Button. As you can see there is a weird gray plain button within the white padding. How do I fix this?

How do I make the gray go away?

.button_style {
background-color: white;
color: white;
padding: 15px 15px;
text-align: center;
display: inline-block;
font-size: 16px;
margin: 4px 2px;

enter image description here

NOTE: The green space is the background, the white space and gray space are both clickable button.

Answer Source

This is what I had previously, which was giving me the plain gray button:

<p><span class="button_style"><a href="">Website</a></span> </p>

I changed it to the following, which resolved my problem:

<input class="button_style" type="button" onclick="location.href = '';" value="Visit Site" />

NOTE: JavaScript must be enabled in order to use 'onclick="location.href'

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download