How to remove gray "border" on HTML buttons
P粉986028039
P粉986028039 2024-03-30 10:30:48
0
1
508

I see a border around the button on the HTML page. I'm trying to make one button blue and one green and place them on a table. code show as below:

<table align="center">
  <tr style=" font-family: verdana; font-size: 24px;">
    <th> Select your Region </th>
  </tr>
  <tr>
  </tr>
  <tr>
  </tr>
  <tr>
  </tr>
  <tr>
  </tr>
  <tr>
    <td align="center">
      <button>
            <a id="cust" type="button" 
            style=
            "background-color: #00824A;
              border: none;
              color: white;
              padding: 16px 55px;
              text-align: center;
              text-decoration: none;
              display: inline-block;
              font-size: 16px;
              margin: 4px 2px;
              transition-duration: 0.4s;
              cursor: pointer;
              font-weight: bold;
              font-family: verdana"
            href="URL">
            US
            </a>
            </button>
    </td>
  </tr>
  <tr>
  </tr>
  <tr>
  </tr>
  <tr>
  </tr>
  <tr>
  </tr>
  <tr>
    <td align="center">
      <button>
            <a id="cust" type="button" 
            style=
            "background-color: #0061D5;
              border: none;
              color: white;
              padding: 16px 55px;
              text-align: center;
              text-decoration: none;
              display: inline-block;
              font-size: 16px;
              margin: 4px 2px;
              transition-duration: 0.4s;
              cursor: pointer;
              font-weight: bold;
              font-family: verdana" 
            href="URL">
            EU
            </a>
            </button>
    </td>
  </tr>
</table>

This is how they appear on the web page:

I want the entire button to be that color with no gray around it. I removed the "border" with border: none in the style. Instead, it displays a color rectangle inside a larger gray button.

P粉986028039
P粉986028039

reply all(1)
P粉605233764

The

border is the button element itself, not the link within it. You need to style the button using

and remove the default border

Related reading: https://css-tricks.com/overriding-default-button style/


Select your Region
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template