Discussion :

[Tibzz]

Bonjour,

Je suis entrain de créer un site web et j'ai un problème "d'incompatibilité" entre FF et IE.

J'ai un div avec avec plusieurs éléments dedans (champs login/mdp pour se connecter, bouton connexion et bouton demande d'inscription).
Sur FF tout s'affiche comme je le désire, mais sous IE, mon bouton demande d'inscription est positionné en dessous de mon div.
Je ne sais vraiment pas d'où viens cette différence. J'espère que vous pourrez m'aider.

Le code css:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
#login {
	height:226px;
	width:224px;
    text-align: left;
	background: url(../images/login_fond_verti.png);
	display: block;
	margin-left: 0px;
	padding-left: 20px;
	color: grey;
}
div#connexion{
	float: left;	
}
div#mdp{
	float: left;
	margin-left: 5px;
	margin-top: 3px;
	font-size: 8px;
}

Et le HTML:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
<div id="login">
					<font color="#ac0068" size=2><b>Identifiant</b></font>		
					<p class="field">
						<input type="text" name="username" size="19" value="${flash.username}" />
					</p>
					<font color="#ac0068" size=2><b>Mot de passe</b></font>
					<p class="field">
						<input type="password" name="password" size="19"/>
					</p>    
					<p>
					<input type="checkbox" name="remember" value="true" /><font size=2> Se souvenir de moi</font><br />
					</p>
					<div id="connexion">
						<input type="image" src="../public/images/connexion.png" name="Account login">
					</div>
					<div id="mdp">
						<a href="@{forgetpwd()}"><u>Mot de passe </br>oubli&eacute; ?</u></a>							
					</div>																			
					#{/form}				
					#{if afficher == true}					
						<a href="@{Application.inscription()}"><img style="border: none;" src="../public/images/demandeinscription.png"></a>					
					#{/if}				
				</div>

Merci de votre aide!

Edit: j'ai réussi, je fermais mal mon formulaire

[miss_socrates]

Je ne vois pas bien quel bouton est mal positionné.
Je dirais : pour avoir tous les boutons en ligne , les inclure dans une div avec les propriétés float:left ou display;:inline

Remarque: remplacer la balise HTML <font color> (obsolète) par du CSS: text-color: red; (ou autre couleur)