HTML / CSS How to add image icon to input type=“button”?

Question

I\'m using the below CSS, but it puts an image in the center of the button. Any way to left or right align an icon using , so that

Answer 1

sshow's answer did it for me, too:

navigation.css:

[...]

.buttonConfiguration {
    width: 40px;
    background-color: red; /* transparent; */
    border: none;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-family: corbel;
    font-size: 12px;
    font-weight: normal;
    margin: 1px 1px;
    cursor: pointer;

    background-image: url('../images/icons5/gear_16.png');
    background-position: center; /* 0px 0px; */
    background-repeat: no-repeat;
    vertical-align: middle;
}

[...]

frameMenu.php:

[... PHP, Javascript and HTML code ...]









[...]

I have tested this successfully under the lastest versions of Firefox and Chrome (as of February 9th, 2019).