Utiliser CSS pour image dans header?

Bonjour

Pour l'instant, j'affiche une image avec le code simpliste HTML suivant:

<TD with=100%><IMG align=center alt "FormaGest" hspace=0 width=100% src="templates/GestInfo_general/images/BaniereGestInfo.png"></TD>

Y a-t-il un ou des avantages a utiliser un style CSS, pour obtenir le même résultat, c'est à dire position en haut de la page et sur toute la largeur, et dans l'affirmatve le(s)quel(s)? Est-ce que celà facilitera le placement de ce qui suit l'image ie la ligne de salutation, les boutons du menu...

J'essaie de refondre le site que j'avais fait à l'époque en tatonnant beaucoup et à la mode "débutant". Tout y est placé en utilisant des tableaux.

Merci.

Ton image peut facilement s'étendre sur toute la largeur du navigateur grâce à CSS.
Il y a de nombreux avantages à recourir à CSS pour la mise en forme plutôt qu'à l'utilisation de tables. Nombreux sont les articles qui traitent de ces bénéfices, dont celui-ci: Petite comparaison entre les tableaux et les standards.
Modifié par Benjamin D.C. (20 Jan 2008 - 00:50)

Merci de ta réponse.

J'ai donc créé un style pour l'image, mais pour la propriété whith=100%, l'image ne prend pas tous l'écran. Un problèle de marge peut-être? J'ai mis with=1580px et précisé la hauteur en proportion (176px). Ne srait-il pas mieux de s'exprimer en pourcentage afin de s'adapter à différents écrans? J'ai bien lu quelque chose sur le sujet, mais je ne retrouve plus.

Merci.

«whith», «with», un signe égale à la place des deux-points... on parle bien de CSS, ici?

Pour rappel, pour donner une largeur de 100% de la place disponible à un élément, on procédera ainsi en CSS:

sélecteur {width: 100%;}

Par exemple, pour une image placée dans le code HTML (élément img) à l'intérieur d'un div portant l'identifiant "header", on pourra écrire:

div#header img {width: 100%;}

Pour que l'image prenne toute la largeur de l'écran, il faudra que div#header prenne lui-même toute la largeur de l'écran, et n'aie pas de bordure ou de padding latéral.

Ceci dit, je ne suis pas sûr que cet élargissement automatique soit très heureux. L'image risque d'être déformée dans les résolutions qui ne correspondent pas à la résolution «idéale».
On pourrait imaginer de travailler avec une image centrée ou alignée à gauche, qui s'afficherait sur un bandeau qui lui prendrait toute la largeur et aurait en couleur ou image de fond la couleur ou le motif que l'on trouve dans l'image d'en-tête.

Oui, rassures toi, on est bien en css, c'est simplement mon clavier qui a fourché .

Quant à l'image, elle n'est pas dans un div, mais directement en tête de la page, ainsi:

<IMG class="img_entete" SRC="templates/GestInfo_general/images/BaniereGestInfo.png">

Dans la feuille ccs, j'ai:

.img_entete {
	/* style des image en tête de page */
	position: absolute;
	top: 0 px;
	left: 0 px;
	width: 1280 px;
	height: 176 px;
}

Eh bien, avec ce code le width:100% devrait marcher, normalement. Du moins, si cette image positionnée en absolu n'a pas de parent ou ancêtre positionné en absolu ou relatif autre que body.

Et un body {margin: 0; padding: 0;} peut aider, si besoin.