28172 sujets

CSS et mise en forme, CSS3

Hello. Je souhaite créer un fieldset avec une bordure de quelques pixels d'épaisseur (jusque là pas de souci), et mettre la légende du fieldset en haut au centre.

Sous Chrome ça fonctionne parfaitement :

legend{
	font-family:Verdana,serif;
	font-weight:bold;
	color:white;
	margin: auto;
	width: 94px;
	display: block;
}


Sous Mozilla FF, le texte reste à gauche.
Sous IE, le texte est au centre mais n'est pas verticalement centré par rapport à la bordure du fieldset.

Des idées ?
Hello.

Styler les legend, c'est la plaie. Visiblement, pour Firefox, il faut lui rajouter un width: 100% pour que ça le fasse.

J'ai fait un petit dabblet, le résultat peux-être vu ici.

Testé vite fait sous FF11, IE9, Opéra 11 et Chrome 17.
Administrateur
Bonjour et bienvenue RobTaku, Smiley smile

Florian> intéressante ton astuce. Et OK sous IE7.
Pour pas m'embêter je style un legend>span, après avoir ajouté un span donc (idem avec table>caption), mais apparemment il y a encore de l'espoir sans Smiley smile
Hello, merci pour l'accueil et merci Florian pour l'exemple. Si j'ai bien compris dans ce cas le background sert à simuler la bordure top ?
Le background était juste pour illustrer l'exemple, il ne sert à rien dans le cas présent. Sinon, de tête, je crois que pour IE6 j'avais du gruger en appliquant un margin négatif de 7px, le padding-left de 7px n'était pas supprimable. Par contre, je n'ai pas de IE6 sous la main pour tester dans l'immédiat.