28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

j'ai un petit souci avec l'affichage d'un fieldset sous Chrome et Safari, qui ne se produit pas dans Firefox, Opera et IE.

Voici le code :

<fieldset class="left"><legend>Myfield</legend>
   <p class="left">
      <label for="prix1">Prix du pack</label>
      <input type="text" id="prix1" name="prix1" />
   </p>
   <p class="left">
      <label for="prixtick1">Prix du ticket</label>
      <input type="text" id="prixtick1" name="prixtick1" />
   </p>
</fieldset>

form p {
    float: left;
    overflow: auto;
    margin-bottom: 1.3em;
    width: 150px;
}
form fieldset {
    float: left;
    padding: 5px 10px;
    margin-bottom: 10px;
}


L'image de gauche correspond à Firefox, ici, les deux p sont bien flottants, alors que sous Chrome/Safari (à droite), ils sont l'un en dessous de l'autre :

http://img440.imageshack.us/img440/6369/sanstitre1uc.png


Pourtant, si j'ouvre l'inspecteur d'éléments de Chrome, que je décoche dans le CSS la propriété "float: left" du fieldset, et que je la coche de nouveau, j'obtiens bien le même résultat que sous Firefox, les deux p cote à cote. Le comportement est identique sous Safari.

Y'a-t-il un illogisme dans mon code ou est-ce bien un problème d'affichage de Chrome/Safari ? Ou les deux ? Smiley smile

Merci d'avance
Modifié par eddie5150 (04 Aug 2010 - 10:53)
Salut,

L'extrait de code que tu donnes ne produit pas l'effet en question, ni sous Safari ni sous Chrome (en tout cas chez moi). Tu peux donner l'url d'une page en ligne, ou au pire ton code HTML/CSS complet ?
En ce qui me concerne, j'ai pas d'idée sur le pourquoi de la chose...

Mais j'ai quand même remarqué que dans l'inspecteur web de Safari, quand on supprime la largeur de #content puis qu'on la remet (en décochant puis re-cochant la checkbox), l'affichage est désormais identique à celui de Firefox. Donc bon, peut-être un bug de Webkit...

Pour contourner le problème, ne peux-tu pas mettre une largeur fixe sur le fieldset ?
Effectivement, je vais opter pour une largeur fixe.

Mais le comportement est vraiment bizarre : même si je décoche une propriété qui n'a aucun rapport (comme la couleur de fond du body par exemple), cela rétabli quand même le fieldset comme sous Firefox !

Je marque comme résolu, mais si quelqu'un a une explication, c'est pas de refus, bien que je penche plutôt également pour un petit bug.


Merci en tout cas !
Modifié par eddie5150 (04 Aug 2010 - 10:53)