bonjour à tous,

les développeurs de mon boulot viennent de passer le site en php. Je m'occupe de la partie graphisme du site donc je ne comprends pas tout.
Voici ce qui me pose pb :
Je dois positionner une image dans une balise <div> et je veux que cette image prenne toute la place dans la balise, pas de marges. Je précise donc la taille de la balise identique à la taille de l'image. Au final, à l'ecran il y a un décalage, le <div> est plus grand en hauteur que l'image.

voici le code :

$aEcrire .= "<div style=\"background-color:#FF5900;width:162px;height:27px;\">";
$aEcrire .= "<img src=\"".RACINESITE."/images/Rubriques/rectangle_basedoc.gif\" /></div>";

Pourquoi le div est plus grand que l'image ?

Merci pour votre aide .

Je n'ai aucun souci avec ça. Mon div prend bien la même taille que mon image...

Tu peux nous fournir un code plus complet ou encore mieux l'url où on pourrait jeter un oeil sur ce que ça donne ?

pour l'url c'est hélas impossible, c'est un intranet restreint.

pour le code voici ce que j'ai en plus :

case "imageHaut" :
$aEcrire .= "<div style=\"background-color:#FFFFFF;width:162px;height:27px;\">";
$aEcrire .= "<img src=\"".RACINESITE."/images/Rubriques/rectangle_basedoc.gif\" /></div>";
$aEcrire .= "<div style=\"border-color:#FF5900;border-width:2px 0 0 0;border-style:solid;height:2px;width:542px;\"></div>";
break;

si je comprends bien, j'ai deux balises div. La premiere contient une image (162*27) et la seconde une bordure sur le haut (542*2). Je veux que la bordure de la seconde balise touche le bas mon image. Là j'ai un espace entre les deux comme si il y avait une marge.

idem...j'ai testé ton code, la bordure est bien collé à mon image du haut. Tu utilises quoi comme navigateur ? C'est peut être çà, je teste sur IE.

idem...j'ai testé ton code, la bordure est bien collé à mon image du haut. Tu utilises quoi comme navigateur ? C'est peut être çà, je teste sur IE.

IE 6.0
merci à vous en tt cas

Essaies changer la bordure pour voir ce que ça donne (border-width:2px 0 0 0;)

Si dans ton CSS tu mes ca:

body {
margin: 0px;
padding 0px;
}


ca donne quoi ?

Si dans ton CSS tu mes ca:

body {
margin: 0px;
padding 0px;
}


ca donne quoi ?

pas mieux mais je verrais ça la semaine prochaine. Je vous tiendrai au courant.
J'ai une solution d'attente : mettre les deux <div> de la même couleur (#FF5900). L'image parrait plus grande mais cette barre ou marge blanche disparait...

Sinon pourquoi tu n'applique pas une bordure bottom a ton premier div et tu supprime le 2eme ?

Je crois que je vais abandonner, j'ai réussi à coller cette bordure en jouant avec le fichier html lié (vertical-align:baseline)... par contre cela descent aussi mon menu à gauche de la page :

<div style="border-width:0;margin:0;background-color:#BDBECE;vertical-align:top;">
{bandeauGaucheOutils}
<span style="width:603px;background-color:#FFFFFF;vertical-align:baseline;text-align:left;">
{imageHaut}
{passagePost}

Je vais essayer de faire différement.

Merci bonne journée

Sinon si tu as toujours un probleme avec ton css va faire un tour ici :
http://forum.alsacreations.com/forum.php