title: CSS padding to input text focus area
body: <p>I have an input text. When focus / selected text it adds a blue background to it. It's not as high as the input field. Is it possible to have padding on the focus area?</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;input type="text" value="My text"&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>input {
    padding: 10px;
    height: 30px;
    line-height: 30px;
  }
  </code></pre>
  
  <p><strong>Fiddle</strong></p>
  
  <p>Select the text to see focus background. Is it possible to have padding on this background?</p>
  
  <p><a href="https://jsfiddle.net/fpjc9pLy/" rel="nofollow">https://jsfiddle.net/fpjc9pLy/</a></p>