28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un petit soucis pour la mise en forme d'un formulaire entre IE7/8 et supérieur.

Dans IE9 et autre c'est ok :
http://img690.imageshack.us/img690/183/2bk1.png

Mais dans IE7/8 Smiley decu
http://img833.imageshack.us/img833/433/msaz.png

Voici mon code HTML :
<div id="part1">
        <label for="creator">Etablie par :</label>
        <input id="creator" type="text" />
        <label for="function">Poste et lieu :</label>
        <input id="function" type="text" />
        <label for="date">Date :</label>
        <input id="date" type="date" />
      </div>

Et le CSS :
#part1{float:left;clear:both;margin-bottom:10px}

#part1 label{width:100px;display:block;float:left;clear:left}
#part1 input{margin-bottom:5px;float:left}


Merci pour votre aide Smiley smile
Salut cerede2000,

Pour ton problème, je te propose de faire comme ceci (je n'ai pas eu le temps de tester)
<div id="part1">
        <label for="creator">Etablie par :</label>
        <input id="creator" type="text" />
</div>
<div id="part1">
        <label for="function">Poste et lieu :</label>
        <input id="function" type="text" />
</div>
<div id="part1">
        <label for="date">Date :</label>
        <input id="date" type="date" />
</div>


ça corrigera peut-être ton problème.
Attention à la sémantique et la validité HTML. Les id on s'en sert qu'une seule fois. A remplacer par une class
Bonjour à toutes et à tous.

Je donne aussi ma petite solution.

Une différence tout de même.
J'utilise les balises label pour la mise en forme du libelle et de la zone de saisie.
Donc il n'est pas nécessaire de placer des balises div pour jouer le même rôle de présentation.
La syntaxe exige de mettre la même valeur pour le "for" et le ID du input.

J'ai testé sous IE 10.0 mais pas sous IE 8.0 car je ne l'ai plus sur mon ordinateur.

@+