Page 1 sur 1
image dans une balise div
Posté : 17 févr. 2006, 16:29
par Loeiz
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 .
Posté : 17 févr. 2006, 16:42
par charabia
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 ?
Posté : 17 févr. 2006, 16:49
par Loeiz
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.
Posté : 17 févr. 2006, 16:53
par charabia
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.
Posté : 17 févr. 2006, 16:54
par Loeiz
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
Posté : 17 févr. 2006, 16:55
par charabia
Essaies changer la bordure pour voir ce que ça donne (border-width:2px 0 0 0;)
Posté : 17 févr. 2006, 17:00
par JumBay
Si dans ton CSS tu mes ca:
body {
margin: 0px;
padding 0px;
}
ca donne quoi ?
Posté : 17 févr. 2006, 17:08
par Loeiz
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...
Posté : 17 févr. 2006, 17:12
par JumBay
Sinon pourquoi tu n'applique pas une bordure bottom a ton premier div et tu supprime le 2eme ?
Posté : 20 févr. 2006, 10:01
par Loeiz
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
Posté : 20 févr. 2006, 18:06
par JumBay
Sinon si tu as toujours un probleme avec ton css va faire un tour ici :
http://forum.alsacreations.com/forum.php