[RESOLVED] IE assumes 95% of page, FF assumes 95% of div.

[postedoverseas]

Hi again,

The third post of the day for the thrid problem of the day.
Right, here it is.
I have the following class

div#form500 {
	float:left;
	width:95%;
	border:1px solid red;
	}

Firefox assumes that I mean the width to be 95% of the div (which is what I am wanting, but IE7 assumes that I mean 95% of the page.

Is there anything I can do, it does the same in IE6 and IE7.
John

[WebJoel]

Can we see more of your code? Just what you posted isn't really of much help. But wha you're asking for doesn't sound impossible to do.

[Stephen Philbin]

Does specifying a width on the containing div help?

[postedoverseas]

Here is all the relevant CSS

* {
	margin:0;
	padding:0;
	}
body {
	font-family: verdana, arial, sans-serif; 
	font-size:100%;
	background-color: #95FF95;
	color:#000000;
	}
.clearboth {
	clear:both;
	}
div#menu {
	float:left;
	width:180px;
	margin:5px 20px 0 5px;
	}
div#page_content {
	margin:5px 0 0 190px;
	}
.form500 {
	float:left;
	width:95%;
	}
* html .form500 {
	float:left;
	width:95%;
	padding:0px;
	}
.label {
	float:left;
	width:49%;
	margin-top:2px;
	margin:5px 0 5px 0;
	}
.input {
	float:right;
	width:49%;
	margin:5px 0 5px 0;
	}

The menu div is on the left, if you want I can post all of the code.
Here is the form that keeps slipping under the menu div. All the code below is inside the page content div

<form class="form500" name="friend" id="friend" method="post" action="" onSubmit="return validate2()">
	<h4>Form 1: (Email a friend about the campaign)</h4>
	<div class="clearboth">
		<p class="label">Enter your name:</p>
		<input class="input" name="yourName" type="text" id="yourName" size="30" />
	</div>
	<div class="clearboth">
		<p class="label">Enter your Email address:</p>
		<input class="input" name="yourEmail" type="text" id="yourEmail" size="30" />
	</div>
	<div class="clearboth">
		<p class="label">Enter your friends name:</p>
		<input class="input" name="friendsName" type="text" id="friendsName" size="30" />
	</div>
	<div class="clearboth">
		<p class="label">Enter your friends Email address:</p>
		<input class="input" name="friendsEmail" type="text" id="friendsEmail" size="30" />
	</div>
	<div class="clearboth">
		<p class="label">Enter a short message: (optional)<br />To change the text of the mesage, click in the message box, press CTRL + A and then del or backspace.</p>
		<textarea class="input" name="message" cols="26" rows="7"></textarea>
	</div>
	<div class="clearboth">
		<div align="right">
			<input type="submit" name="Submit2" value="Email Friend" />
		</div>
	</div>
</form>

If I make the class a certain size then it works but I want the form to be centered on the users screen

[postedoverseas]

It's not the CSS, Ive been doing some troubleshouting and have narrowed it down to the javascript that is in the page.
When the javascript is ther, it moves the forms down, when it is out the page looks normal

If you want more deatils it is now on the javascript forum
http://www.webdevelopers.com/forum/s...566#post624566
Thanks anyway
John