28220 sujets

CSS et mise en forme, CSS3

Balise fieldset, couleur de fond [Résolu]

Bonjour,

Savez-vous si il est possible de corriger l'aspect de la balise <fieldset> ?

J'ai une couleur de fond et un border très simple mais sous IE la couleur de fond couvre la hauteur totale de la balise "legend" comprise.

CF : exemple. upload/319-IEvsPC.gif

merci
Modifié par ernstein (03 Mar 2005 - 10:04)
Bon, ben tu viens de calmer mes derniers moments de bonhumeur ce cette belle matinée pleine de neige.

ARF !!!!!!!!! je déteste Internet Explorer !

Voilà çà fait du bien.

Merci, j'ai au moins évité de perdre mon temps la dessus.
Je crois qu'il y a une solution. Je ne sais pas si elle s'applique à tous les cas de design, mais j'ai remarqué que si l'on positionne en relatif la légende, et que l'on décale sa position avec top, par exemple top:-10px, alors le fond du fieldset s'arrête à sa bordure au lieu de couvrir également la légende.

Qu'est ce que ça donne chez vous ?
Et bien y'a de çà, mais du coup le border est intérrompu au niveau de la zone de présence normale de la légende, et pour le coup je me demande vraiment coment la rendre pleine.

Sinon, je vais chercher autour de ton astuce..

Encore merci
Oui le position:relatif modifie également le positionnement horizontal de la légende. Un petit coup de propriété left doit régler l'affaire.
Autre solution utiliser le padding sur la légende pour l'agrandir et couvrir la zone privée de bordure.
Après avoir fait une recherche sur le forum, je voudrais avoir la solution de ce post original .. car j'ai était aussi bien surpris de voir que mes <fieldset> étaitent horrible sous IE (couleur de fond dépassant au niveau du <legend>). Quelqu'un a t-il une solution ou un "hack ccs for ie" ?


pour l'instant la solution qu j'ai est la suivante :

En descendant pour IE le top du fieldset d'1em en position relative et
en relevant le top de la legende d'1em en relative :

 fieldset {
 position : relative;
 top : 1em;
 padding : 0 0.5em 1em 0.5em;
 background-color : #CCC;
 }
 html>body fieldset {
 padding-top : 1em;
 top : 0;
 }
 legend {
 position : relative;
 top : -1em;
 padding : 0.4em;
 }


est-ce la bonne méthode ou y a-til une solution plus "propre" ?

merci

++
Modifié par P75 (31 Aug 2005 - 10:09)
Sujet clos
Aller à