How to vertically align an image inside a <h1> tag

HTML ``` <h1>abc abc<span><img class="goldT" src="btns/nav02.png"></span></h1> ``` css ``` h1{ margin:15px 0 15px 20px; font-size:1.1rem; font-weight:bold; background:#e1e1e1; padding-left:10px; color: #444444; } h1 span{ float:right; margin-right:14px; } h1 .goldT{ width:140px; vertical-align:middle; } ``` How can I keep img `goldT` vertically centered with header text `abc`. Here is the FIDDLE