ボタンの背景イメージを左揃えに設定するにはどうすればよいですか？

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: url('...') no-repeatやbackground-repeat: no-repeatを使用することができ、background-imageにno-repeatを設定し、またcenter Web標準から削除されました。そして、あなたは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>