Почему я не могу выровнять этот текст по вертикали?

Question

Я не могу заставить этот текст выравниваться по вертикали. Может кто-нибудь сказать, пожалуйста, что я делаю не так? Я хочу центрировать этот «тестовый» текст по центру изображения слева, что является кнопкой отправки.

<input type="image" src="send.gif" name="send" value="" />
<span style="font-weight:bold;padding:0;margin-left:20px;vertical-align:middle">test</span>

---

Спасибо, ребята .. Не могу понять это. У меня всегда были проблемы с выравниванием по вертикали.

<div id="postcomments">
  <form method="post" action="comments.php">
    <div>
      <h2>Comments</h2>
      Name:<br />
      <input type="text" id="name" name="name" />
      Email:<br />
      <input type="text" id="email" name="email" />
      Website:<br />
      <input type="text" id="site" name="site" />
      Story:<br />
      <select id="mute" name="mute">
        <option value="">hello</option>
      </select><br />
      Comments:<br />
      <textarea name="comment" rows="10" cols="46"></textarea><br /><br />
      <input type="image" src="send.gif" name="send" value="" />
      <span style="font-weight:bold;color:red;padding:0;margin-left:20px;vertical-align:middle">test</span>
    </div>
  </form>

Answer 1

Вы должны применить vertical-align: middle к элементу изображения, а не к диапазону. Это должно работать:

<input type="image" src="send.gif" name="send" value="" style="vertical-align:middle" />
<span style="font-weight:bold;padding:0;margin-left:20px;">test</span>

Answer 2

Выравнивание в этом случае должно применяться к изображению, а не к диапазону. Вы можете использовать свойство align для тега INPUT, чтобы выполнить это:

<input type="image" src="send.gif" name="send" value="" align="middle" />
<span style="font-weight:bold;padding:0;margin-left:20px;">test</span>

В качестве альтернативы, используя CSS:

<input type="image" src="send.gif" name="send" value="" style="vertical-align: middle" />
<span style="font-weight:bold;padding:0;margin-left:20px;">test</span>