Вертикальное выравнивание img и текста внутри

Я не могу получить img и текст в диапазоне для быть выровненным по вертикали:

  <p class="login-button">
                    <input type="submit" id="login-submit" value="Log On" /><img style="padding-left:20px;" id="loadingDiv" src="/Content/ib/images/ajax-loader.gif" />
                    <span id="error" style="color:red; padding-left:13px;">text </span>

                </p>

Есть идеи? Я пробовал:

.login-button{ vertical-align:middle; height:30px; line-height:30px;}
.login-button img{ vertical-align:middle;}