Align text and image in links

<ul>

<li> <a href='/adminsetting/index'>Moodle Settings <img src="../img/Themelink1.png"/></a></li>
	        
<li><a href='/adminsetting/themedesigner'>Theme Designer <img src="../img/Themelink2.png"/></a></li>
	        
<li><a href="#">Payment Details <img src="../img/Themelink3.png"/></a></li>
	        
<li><a href="#">Account Profile <img src="../img/Themelink4.png"/></a></li>
	       
<li><a href="#">Trainig <img src="../img/Themelink5.png"/></a></li>
	       
<li><a href="#">Help <img src="../img/Themelink6.png"/></a></li>
	       
</ul>

ul li{
list-style:none;
}

Moodle Settings img
 Theme Designer img
Payment Details img
       Training img
           Help img

Moodle Settings img
Theme Designer img
Payment Details img
Training img
Help img