Image inside a button not positioned correctly in Firefox
- by Dominic Rodger
I have the following markup:
<p class="managebox">
<button value="Add page">
<img src="page_add.png" alt="Add more content" />
Add Page
</button>
</p>
And the following CSS:
p.managebox { position: relative; }
p.managebox button { display: block;
padding: 5px 7px 4px 30px;
position: relative; }
p.managebox button img { position: absolute; left: 7px; }
In IE 8 I get this:
In Chrome 4.0 I get this:
In Firefox 3.6 I get this:
Does anyone know what I'm doing wrong? One thing I've just realised that may be relevant - if I use an a instead of button, it works fine.
