Problème de positionnement d'image , Erreur de code ?

Question

Bonjour à tous et a toutes !

Depuis plusieurs jours je regresse sur un problème qui persiste , depuis je n'avance plus sur mon site :( 
Je suis étonné car le code me paraît bon , mais une erreur persiste . Je vous demande donc de l'aide pour résoudre mon problème si vous le pouvez bien sur ;)

Je code en php / css une page de news , dans celle ci j'aimerais qu'a chaque news un cadre apparaisse autour de chaque news , mais ce cadre est un cadre avec des images il faut donc placer les angles haut gauche / droit bas gauche / droit + bordures de chaque cotés mais j'arrive a  2 problèmes persistants :

Je cite mon code PHP :

,
,




 



,
,






 



,
,


Et désormais je cite mon code css : 


.ntoln{
 background-image: url(images/Angle Haut gauche copie GIF.gif);
 background-repeat: no-repeat;
}



.ntorepn{
 background-image: url(images/bordure haut.jpg);
 background-repeat: repeat-x;
 width: 100%;
}



.ntorn{
 background-image: url(images/Angle Haut droit copie GIF.gif);
 background-repeat: no-repeat;
}




 



.stoln{
 background-image: url(images/bordure gauche.jpg);
 background-repeat: repeat-y;
}



.storn{
 background-image: url(images/bordure droite.jpg);
 background-repeat: repeat-y;



}



.stonn{
 background-image: url(images/Fond.jpg);
 background-repeat: repeat -x;
 background-repeat: repeat -y;
 width: 100%;
}




 



.btoln{
 background-image: url(images/Angle Bas gauche copie GIF.gif);
 background-repeat: no-repeat;
}



.btorep{
 background-image: url(images/bordure bas.jpg);
 background-repeat: repeat-x;
 width: 100%;
}



.btorn{
 background-image: url(images/Angle Bas droite GIF copie.gif);
 background-repeat: no-repeat;
}


Vous pouvez constatez via internet explorer sur l'adresse de mon site qui est la suivante : http://s231431574.onlinehome.fr/LATEST/news.php que le cadre placé tout en bas ne forme pas entièrement son cadre la barre d'en dessous ne s'alligne pas avec le reste , je suis donc en de m'acharner sur ce problème persistant et très énervant depuis plusieurs jours , de plus ! Les bordures situés tout en bas de la page  ne s'affiche qu'avec Internet Explorer mais pas avec Firefox créant ainsi 2 problèmes différent ! :(   

Ne vous inquiétez pas je fais un test en bas de page pour après le placer en contour !

J'espère que vous pourez m'aider ,

J'espère ne pas avoir été trop long à lire !

Merci à tous ceux qui s'interesseront à mon problème .

neigedhiver · Answer

Salut, Je sais pas si ça règlera le problème (désolé, je ne peux pas tester avec IE), mais deux choses : - les attributs des balises HTML doivent être placés entre guillemets doubles, et non entre guillemets simples : =>

C'est OBLIGATOIRE en XHTML 1.1 - les url des images dans le CSS doivent être placés entre guillemets simples background-image: url(images/Fond.jpg); => background-image: url('images/Fond.jpg'); C'est en tout cas ce qu'on lit dans les spécifications CSS du W3C Les noms de fichiers ne devraient pas comporter d'espace, ou alors les espace devraient être encodés : idem, c'est dans les spécifications du W3C. background-image: url(images/Angle Haut droit copie GIF.gif); => background-image: url('images/Angle%20Haut%20gauche%20copie%20GIF.gif'); Le mieux étant de ne pas mettre d'espace, c'est quand même plus propre.

Neige N'hésitez pas à lire la doc de PHP avant de poser des questions triviales...

Flash11 · Answer

Bonjour et merci à toi pour ta réponse Neige !

Je ne peux mettre entre guillemets doubles :

<table style="width:100%" cellpadding="0" cellspacing="0">

Car ce n'est pas en html qu'est la page mais en php :(

De plus j'ai effectué les autres changements mais rien ne change .

J'attend vos réponses avec impatience !

Merci encore

Flash11 · Answer

Je up le message , 

Merci à ceux qui m'aideront

neigedhiver · Answer

Si, tu peux le faire. Et en plus, tu DOIS le faire. Sinon, tu ne mets pas comme DOCTYPE que c'est XHTML 1.1 Strict, mais HTML4.0

Le fait que ce soit des chaines en PHP ne t'empêche nullement de mettre des guillemets doubles : il suffit de les échapper avec un antislash :
echo "Ceci est une chaine avec des "guillemets"";
Et puis pour afficher une chaine, il est préférable d'utiliser des guillemets simples.

Essaie de mettre des url absolues (depuis la racine) plutot que des URL relatives : IE et Forefox peuvent éventuellement les interpréter différemment.

Bon sinon, j'ai la flemme d'aller voir quelles sont les déclaration CSS pour une image de fond...
Essaie d'utiliser background: url('....'); au lieu de background-image
Parce que les images déclarées dans background semblent être correctement affichées.

<hr size="2" width="100%" />Neige

N'hésitez pas à lire la doc de PHP avant de poser des questions triviales...

neigedhiver · Answer

Note : les UP ici ne marchent pas... Il ne servent qu'à envoyer un mail aux personnes qui sont abonnées au message, il ne remonte pas sur le forum.

<hr size="2" width="100%" />Neige

N'hésitez pas à lire la doc de PHP avant de poser des questions triviales...

Flash11 · Answer

Merci neigedhiver ! 
J'ai réussi à régler le problème de Firefox / Internet Explorer , désormais il s'affiche dans les 2 naviguateurs !

Mais le cadrage ne veux toujours pas se faire pourtant j'ai fais comme tu ma dit en remplacant les  '    par  "   mais aucun changement la barre du bas ne se cadre toujours pas je trouve ca très étonnant merci à toi j'attend ta réponse !

neigedhiver · Answer

Effectivement, les images apparaissent. Mais chez moi, elles apparaissent carrément en dessous de ton article (juste après l'image quoi).
Du coup, c'est sûrement pour ça que l'image du bas du cadre n'est pas alignée avec les autres.
Et ça vient très certainement que tu fais tes placements dans des balises div (ce qui est très bien, j'ai horreur des tableaux pour la mise en page). Mais du coup c'est galère...
Faut que tu fasses attention à tes div, comment ils sont placés. Vas y progressivement, t'en places un, puis un autre, au fur et à mesure. Tu verras plus clair dans ce que tu fais.

<hr size="2" width="100%" />Neige

N'hésitez pas à lire la doc de PHP avant de poser des questions triviales...

Flash11 · Answer

En fait je t'ai dis si je les place en bas c'est déja pour tester c'est pour ca j'essaye déja de tester en faisant un cadre mais la barre du bas se place mal :s

neigedhiver · Answer

Ok. Mais si tu mets une image au milieu, est-ce que justement, ça va pas remplir l'espace ? Et du coup, est-ce que l'image du bas ne se mettra pas correctement au bon endroit ?

<hr size="2" width="100%" />Neige

N'hésitez pas à lire la doc de PHP avant de poser des questions triviales...

Flash11 · Answer

Oui mais mettre une image qui s'étire c'est bête vu que le cadre après devra s'adapter a la largeur de la news :s

Problème de positionnement d'image , Erreur de code ?

10 réponses

Votre réponse

Discussions similaires