<input type="search"> not styling
<p>I am trying to create a simple search bar with a search icon next to it. But I have noticed I can't style a input with the type search. I tried it on safari (Version 9.0.3 (11601.4.4)) and then on chrome (version 49.0.2623.110). At first I thought it was because the input was not valid but found out it was fine to have the type search.</p>

<p>The only thing I was able to style was background-color and it only worked in chrome.</p>

<p>I also tried deleting all my css styles and only styling the input. It did not help.</p>

<p>I tried googling it with no success.</p>

<p>So is their a way around it or will I have to put my input type on text so I can style it?</p>

<p>Thanks in advance! </p>

<p>CODE:</p>

<pre><code>&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;title&gt;Test&lt;/title&gt;
    &lt;style&gt;
        input {
            padding: 10px; /* Does not work */
        }
    &lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;input type="search" placeholder="Search"&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>this code does not work in Safari and Chrome on OS X</p>

<p>EDIT: I am using OS X so could it be a problem with webkit? </p>