Как установить фоновое изображение кнопки влево-выровнять?

Question

Как сделать фоновое изображение рядом с левой границей кнопки?

.button1 { 
 
    background-color: transparent; 
 
    background-image: url('nebifat.png') no-repeat; 
 
    font-size: 30px; 
 
    padding-left: 64px; 
 
    text-align: left; 
 
    position: relative; 
 
    border-style: none; 
 
    height: 7%; 
 
    width: 50%; 
 
    vertical-align: middle; 
 
    margin-top: 10%; 
 
    opacity: 0.6; 
 
}

<center> 
 
    <button id='r1' class='button1'>Matematica si Fizica</button> 
 
</center>

Answer 1

Вы установили в background-imageno-repeat, вместо этого вы можете использовать background: url('...') no-repeat или background-repeat: no-repeat, также center был удален из веб-стандартов. И вы можете поместить фон с background-position

.button1 { 
 
    background-color: transparent; 
 
    background-image: url("http://placehold.it/50x50"); 
 
    background-repeat: no-repeat; 
 
    font-size: 30px; 
 
    padding-left: 64px; 
 
    text-align: left; 
 
    position: relative; 
 
    border-style: none; 
 
    height: 7%; 
 
    width: 50%; 
 
    vertical-align: middle; 
 
    margin-top: 10%; 
 
    opacity: 0.6; 
 
    border: 1px solid black; 
 
    background-position: left; 
 
}

<button id='r1' class='button1'>Matematica si Fizica</button>