form e float

[shmk]

Volevo inserire nella barra di un menù orizzontale un form di login.
Il menù l'ho scritto con dei[*] con float left.

<style>
#menu{display:block; height:30px; background:#ccc;}
#menu li{float:left; width:100px; list-style-type:none;}
#menu a{display:block; text-decoration:none; padding:5px 0px;}
</style>


<div id="menu">
	[*]Link 1
	<form action='login' method='post' style='float:left;'>
	<input type='text' name='username' value='Username' maxlength='30' />
	<input type='password' name='password' value='Password' maxlength='30' />
	<button type='submit'>Send</button>
	</form>
	[*]Link 3
</div>
<div style='clear:left;'></div>

Il fatto è che in firefox funziona bene... ma in IE il form esce dal normale flusso di dati e si piazza una riga sotto, sotto al primo pulsante a sinistra con tutti i campi (2 input ed un button) uno sotto a l'altro al posto che in fila.

Avete qualche consiglio?

[pr0v4]

Prova con l'utilizzo dei margini negativi, io li sto sperimentando in questo periodo e non mi sto trovando affatto male!

[shmk]

Mmh provo a darci un'occhiata.

Cmq ho verificato che se metto il <form> prima dei[*] anche IE lo visualizza correttamente, in pratica se il <form> è float rispetto ad un altro elemento float IE me lo mette sotto.

[*]Link 1
<form action='login' method='post' style='float:left;'>
<button type='submit'>Send</button>
</form>[*]Link 3

Firefox tutto inlinea - IE i[*] in linea il <form> sotto al primo li

<form action='login' method='post' style='float:left;'>
<button type='submit'>Send</button>
</form>[*]Link 1[*]Link 3

Firefox and IE tutto inlinea