Form Different in IE

[lmw1]

Can someone look at this and tell me why it's displaying inline (like it should) in FF and not in IE?

rootsofthought dot com

Respectfully,
Len

[teedoff]

I dont see a form on the page you didnt link using the link button...lol

Be more specific please.

[lmw1]

My apologies. Here's the link.

http://www.rootsofthought.com

The form is at the bottom. It's just a sign-up form with 2 fields.

It looks right in FF (horizontal), but in IE it's stacked vertically. It should be horizontally aligned crowsbrowser-wise.

Thanks in advance!
Len

[teedoff]

Originally Posted by lmw1

My apologies. Here's the link.

http://www.rootsofthought.com

The form is at the bottom. It's just a sign-up form with 2 fields.

It looks right in FF (horizontal), but in IE it's stacked vertically. It should be horizontally aligned crowsbrowser-wise.

Thanks in advance!
Len

I'm not at all sure how you are seeing your form, but in my FF and IE viewports your form is somewhere way down at the bottom of your background image. Perhaps, since your image is 1500x1150 pixels, and you're using position relative on your forms and awlogo, you might could try instead using margins to position those two elements.

[lmw1]

It's still stacking vertically in IE.

It looks good in FF though.

Any ideas?

Respectfully,
Len

[teedoff]

Originally Posted by lmw1

It's still stacking vertically in IE.

It looks good in FF though.

Any ideas?

Respectfully,
Len

Did you try putting the Name, Email, and button all in the same row? As you have it now, you have 4 rows.

<form>
  <table>
    <tr>
      <th>Name: </th>
      <td><input type="text" size="35" /></td>
      <th>Email: </th>
      <td><input type="text" size="35" /></td>
      <td><input type="submit" value="Submit" /></td>
    </tr>
  </table>
</form>

[lmw1]

I get "a little" lost on the topic of forms. I know what you're saying, but how would I "re-arrange" the following code so that it looks "exactly the same" as it does right now in FF (inline/horizontal)?

<div id="message" style="display:none;color:red;"></div>

	<div id="okmessage" style="display:none;align:center;color:green; margin-bottom:-5px;">Congratulations! We'll keep you posted.</div>

	<table border="0" cellpadding="5" cellspacing="5">
		
		<tr id="formName">
			<td><font size=1 face=Arial style="color:#fff;">Name:</font></td>
			<td><input type="text" name="name" id="name"  value=""></td>
		</tr>

		<tr id="formEmailtop">
			<td><font size=1 face=Arial style="color:#fff;">Email:</font></td>
			<td><input type="text" id="email" name="email" value=""></td>
		</tr>
		
		<tr id="formName">
			<td colspan=2> </td>
		</tr>
		<tr id="formSubmit">
			<td colspan="2" align=right>
			<input  onclick="signup();" type="submit" id="submit" value="Sign up!">
			<div id="loading" style="display:none;align:center;"><img src="wait.gif"></div>
			</td>
		</tr>
	</table>

		</div>

I really do appreciate you helping me!

Respectfully,
Len

[munkeyboy]

I get "a little" lost on the topic of forms. I know what you're saying, but how would I "re-arrange" the following code so that it looks "exactly the same" as it does right now in FF (inline/horizontal)?

The problem isn't with your form, it's with the table that you are using to hold the form fields. Checkout this page for a pretty good tutorial on tables.