Input et border : différence entre IE>6-FF3.5-CHR Vs IE6

Bonjour à tous

J'ai une question ou plutot besoin d'explications.

Je voudrais créer un formulaire avec un border de 5px seulement voici le comportement que j'obtiens :

        <form action="">
            <label for="login">
                Pseudo        
            </label>
            <input type="text" id="login" name="login" />
        </form>

form {
    width: 500px;
    border: #00ff00 thin dashed;
		
}

input {
    width: 100%;
    background-color: #ffffff;
    border: solid #d1d1d1 5px;
}

J'obtiens le résultat :



Que faut-il faire pour obtenir le même comportement que dans ie6 ?
Sachant que je veux conserver :

input {
    width: 100%;
}

Pour une fois que c'est dans ce sens

Merci par avance.
Modifié par pouetprout (31 Jul 2009 - 12:05)

erreur ^^
Me suis loupé j'ai répondu à la place d'éditer
Modifié par pouetprout (31 Jul 2009 - 12:05)

Bien j'ai trouvé une solution qui colle à tous les navigateurs, je vous la fais partager :

        <form action="">
            <div class="main-form">
                <label for="login">
                    Pseudo 
                </label>
                <div class="input-bg">
                    <input type="text" id="login" name="login" />
                </div>
            </div>
        </form>

form {
    width: 300px;
    border: #00ff00 thin dashed;		
}

.main-form{
	border: #00ff00 thin dashed;
	width: 100%;
}
input {
    width: 100%;    
    border: solid #d1d1d1 1px;
}
.input-bg{
	background-color:#d1d1d1;
	border: solid #d1d1d1 1px;
	padding :10px;
	width: auto;
}

J'obtiens le résultat suivant sur tous les navigateurs :




N'hésitez pas à me faire vos remarques si il y a des choses choquantes dans ce que j'écris p^^, je débute

cordialement.
Modifié par pouetprout (31 Jul 2009 - 14:59)