DaveDev
DaveDev

Reputation: 42175

How can I maintain the space between these two buttons in IE7 mode?

I have 2 buttons horizontally aligned. In most browsers there's a space between them, but if you view this:

http://jsfiddle.net/2HP43/1/

in "Browser Mode: IE7" & "Document Mode: IE7 Standards" you can see that the 2 buttons are stuck together.

Can somebody suggest how I can correct this so that there is always a consistent space between these buttons?

Upvotes: 0

Views: 41099

Answers (6)

Safi
Safi

Reputation: 1

I have 3 solutions to this problem:

  1. The easiest is to use   but of course this can't be used professionally.

  2. Use padding property

  3. Use the margin-left property.

Upvotes: -1

bhaskar
bhaskar

Reputation: 11

this might help you to solve the problem

 

Upvotes: 0

Swetha
Swetha

Reputation: 21

This solves my problem:

*padding: 2px; /* "*" is for lte IE 7 */

Upvotes: 2

TimFoolery
TimFoolery

Reputation: 1925

Have you tried putting   in between them?

IE does not render "padding" to W3C standards. (See here for explanation.) That's almost assuredly where this problem is coming from, so you'll need to insert something in between them to make it work properly.

Upvotes: 5

Sotiris
Sotiris

Reputation: 40046

you can use the margin-left property to move the button some pixels right such as margin-left:3px, but first you have to remove the whitespace between the input and button.

Example: http://jsfiddle.net/2HP43/18/

Upvotes: 2

Dan Hanly
Dan Hanly

Reputation: 7839

Try this

<input type="submit" class="button" id="Submit1" value="Remove" name="btnRemoveFunds">&nbsp;<button class="button" id="Button1">Add More Funds</button>

&nbsp; ensures you have a space in there

Upvotes: 1

Related Questions