Question

I am trying to add padding-right to an input so that I can place an image in that corner and not have the text flow behind it. It works fine in Chrome & Firefox but not in IE.

I have seen people recommend using float:left; but still it doesnt work.

See the problem here: http://jsfiddle.net/4zRRt/

Answer 1

That is not how you want to do that (probably, I am guessing, the button image doesn’t work for me obviously).

I am guessing you want an input with a nice submit button which is always on the right.

This is done with a parent relative element and the button who is absolute with a right offset of 10px (to accomedate for the extra space the shadow requires). And a top set to 0…

Here is a jsfiddle of that:

http://jsfiddle.net/sg3s/4zRRt/10/

I put some extra display:block; in there to make the inputs block instead of inline, this will prevent other rendering problems too.