How to Get Rid of the Border on Input Buttons?

Tackling the Border Issue in Input Buttons

As you click on an input button, an unsightly border appears, spoiling the aesthetic appeal. To address this issue, various approaches have been attempted, such as utilizing onfocus: none. However, these efforts have proven futile.

To resolve this persistent problem, a simple solution lies in the realm of CSS. By incorporating outline: none; into your style definition, you can magically erase this unwanted border.

Here's an updated version of the CSS code that will eliminate the border:

input[type=button] {
    width: 120px;
    height: 60px;
    margin-left: 35px;
    display: block;
    background-color: gray;
    color: white;
    border: none;
    outline: none;
}

By applying this CSS rule, the unsightly border will vanish when the input button is clicked. Your button will now showcase a clean, professional appearance.

The above is the detailed content of How to Get Rid of the Border on Input Buttons?. For more information, please follow other related articles on the PHP Chinese website!