title: How to position the text inside a button?
body: <p>I use an untypical image background inside a button. I need to make this text appear "higher" inside the button than the default (which is vertically centered). What I have to do?</p>
  
  <p>CSS:</p>
  
  <pre><code>.button {
     width: 211px;
     height: 66px;
  
     font-family: Arial, Helvetica, sans-serif;
     font-size: 18px;
     text-transform: uppercase;
     color: white;
  
     background: url('../img/button.png') no-repeat;
     border: none;
     cursor: pointer;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input type="submit" class="button" value="Submit"/&gt;
  (...)
  &lt;button class="button"&gt;Get a quote&lt;/button&gt;
  </code></pre>
  
  <p>Screen from browser:
   <img src="https://i.stack.imgur.com/PDx23.png" alt="enter image description here"></p>
  
  <p>As you can see texts in buttons should be little bit higher then it is now</p>