Probleme affichage parge webRésolu/Fermé

Question

Bonjour a tous,
Voila je vient de créer un site et j ai un probleme d affichage
sur mon ecran il s affiche correctement par contre sur celui de ma soeur la barre de menu n est pas pareil
les 2 ordi sont sur Internet explorer

la largeur du site est de 900px

l adresse du site http://picobello.free.fr/index.php

j espere que quelq un pourrait m aider

merci de votre aide

arthezius · Answer

ça serai pas des versions différente de IE ?
Sur Firefox ça semble d'afficher correctement.

audi68 · Answer

non les 2 sont la version 7

mais le mien est un 20 pouces et celui de ma soeur un 17

c est peut etre cela?

arthezius · Answer

Peux tu expliquer les différences entre les deux?

audi68 · Answer

normalement aucune vu que la resolution est superieur a 900px non?

arthezius · Answer

Oui mais si tu dit qu'il y en a, c'est que le cas "normalement" n'est pas vrai.

Explique moi donc les différences que tu as constaté.

audi68 · Answer

ce que j ai constaté c est dans le menu sur neuwsletter chez moi il es bien centre au millieu et il y a de lespace autour et sur l autre le texte depasse

egalement dans horraire chez moi a doite de l horloge le texte es ecrit sur une ligne et sur l autre sur 2 lignes

arthezius · Answer

Déjà c'est Newsletter et pas Neuwsletter. Celà doit venir d'une différence de taille de police à l'affichage. La largeur des boutons étant fixé, si le texte est trop gros, il dépasse.

audi68 · Answer

ah oui merci pour la faute

alors je dois reduire la police?

arthezius · Answer

Ben soit tu changes pour que les boutons ne soit plus avec une largeur fixe, ils s'adapteront donc en largeur au texte, soit, oui, tu changes la taille de la police pour la réduire.

Mêmeen testant avec IE 6, j'ai pas de problème.

audi68 · Answer

bizare quand meme

c es juste sur cet ordi que ca le fait j ai essaier sur d autre et aucun probleme

j ai enlever la largueur fixe et mis 100% mais ca ne marche le texte depasse dans la colonne

arthezius · Answer

Sur l'ordi en question, peut-tu vérifier la taille d'affichage (dans affichage). Y'a pas de raison (je viens de vérifier).

A la limite, si ça viens que du siens, c'est pas bien grave. Toutefois ça aurai été bien de comprendre.

audi68 · Answer

la taille d affichage c est 1440 par 900 px

oui ca serait bien de savoir

audi68 · Answer

ah merci tu me trouve des fautes merci

le cadre du menu au choix est decalé?

moi j ai la meme resolution que toi

audi68 · Answer

Bonsoir xander j avais pas vu que c etait une autre personne merci pour les fautes je vais les corriger on les voit plus a force de voir la meme page oui j ai vu mais c es bizare chez moi ca ne le fait pas ca peut provenir de quoi? voila ce que moi je voit icil

arthezius · Answer

IE 6 pas de souci non plus.

audi68 · Answer

oui c es bizare 
c es juste l autre ordi qui le fait
faut que je trouve un ordi avec un petit ecran

sinon je ne voit pas trop quoi faire

arthezius · Answer

Y'a pas de raison que ça vienne de l'écran.

Voici ce que je vois de mon côté: Capture

Essai ce site sinon: http://browsershots.org/

audi68 · Answer

oui mais sur le IE7 ca ne le fait pas 

ca doit etre une erreur dans mon css?

audi68 · Answer

j ai essaier de modifier le css pour le cadre mais si je le modifie il est decalé sur IE7

arthezius · Answer

Tu peux mettre ici ton code HTML et CSS ?

audi68 · Answer

le voici css /* CSS Document */ body { margin: 10px 0 ; padding: 0 ; text-align: center ; font: 0.8em "Trebuchet MS", helvetica, sans-serif ; background: #dea ; } div#conteneur { width: 900px; text-align: left; border: 2px solid #ab4; height: auto; background-color: #fff; background-position: center center; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; } h1#header { height: 140px; margin: 0; background-image: url(images/3.jpg); background-repeat: no-repeat; background-position: center center; background-attachment: scroll; } h1#header a { width: 400px ; height: 70px ; display: block ; background: url(title.gif) no-repeat ; position: relative ; left: 350px ; top: 15px ; } h1#header a span { display: none ; } ul#menu { height: 35px; margin: 0; padding: 0; background: url(bg_menu.gif) repeat-x 0 -25px; list-style-type: none; } ul#menu li { float: left; text-align: center; } ul#menu li a { width: 126px; line-height: 25px; font-size: 1.4em; font-weight: bold; letter-spacing: 2px; color: #fff; display: block; text-decoration: none; border-right: 2px solid #dea; font-family: "Times New Roman", Times, serif; } ul#menu li a:hover { background: url(bg_menu.gif) repeat-x 0 0 ; } div#contenu { width: 595px; float: right; padding-top: 0px; padding-right: 25px; padding-bottom: 0; padding-left: 25px; } div#contenumontre { width: 595px; float: right; padding-top: 0px; padding-right: 25px; padding-bottom: 0; padding-left: 25px; background-image: url(images/horloge%20pizza%20copiepetit.jpg); background-repeat: no-repeat; background-position: left; margin-top: 0px; } div#contenumontre h2 { padding-left: 25px; line-height: 25px; font-size: 2.1em; color: #9b2; border-bottom: 1px solid #9b2; font-weight: bold; font-family: Georgia, "Times New Roman", Times, serif; background-image: url(images/little_apple.gif); background-repeat: no-repeat; background-position: left bottom; } div#contenumontre h3 { margin-left: 15px; padding-left: 5px; border-bottom: 1px solid #9b2; border-left: 3px solid #9b2; color: #9b2; margin-top: 60px; } div#contenumontre p { text-align: justify; text-indent: 0em; line-height: 2.5em; margin-left: 190px; font-family: Arial, Helvetica, sans-serif; font-size: 1em; margin-top: 0px; font-weight: normal; } div#contenu h2 { padding-left: 25px; line-height: 25px; font-size: 2.1em; color: #9b2; border-bottom: 1px solid #9b2; font-weight: bold; font-family: Georgia, "Times New Roman", Times, serif; background-image: url(images/little_apple.gif); background-repeat: no-repeat; background-position: left bottom; } div#contenu h3 { margin-left: 15px ; padding-left: 5px ; border-bottom: 1px solid #9b2 ; border-left: 3px solid #9b2 ; color: #9b2 ; } div#contenu p { text-align: justify ; text-indent: 0em; line-height: 1.7em ; } div#contenu a { color: #8a0 ; } div#contenu a:hover { color: #9b2 ; } p#menubas { margin: 0; padding-right: 10px; line-height: 20px; text-align: right; color: #8a0; width: 770px; } p#footer { margin: 0; padding-right: 10px; line-height: 30px; text-align: right; color: #8a0; width: 770px; } div#cadre {/* conteneur global et arrière-plan du titre du cadre */ width: 240px; padding-top: 35px; float: left; font-size: 1em; padding-right: 0px; background-image: url(images/haut.gif); background-repeat: no-repeat; background-position: center top; } div#bloccadre {/* arrière-plan bas et sur l'ensemble du cadre */ padding-bottom: 40px; background-image: url(images/bas.gif); background-repeat: no-repeat; background-position: center bottom; width: 240px; } div#bloccadre p { margin: 0 30px 0 20px; font-family: Georgia, "Times New Roman", Times, serif; font-size: 1em; color: #2B2B00; text-align: center; } div#cadrebas { width:190px; height: auto; text-align: center; background-color: #cde699; border: thick double #99CC33; font-family: Georgia, "Times New Roman", Times, serif; font-size: 1em; color: #2B2B00; padding: 5px; left: 0px; right: 0px; margin: 20px; top: 0px; bottom: 0px; } div#pied_page { clear:both; width:900px; height:0px; } pre { overflow: auto ; background: #dea ; border: 2px solid #9b2 ; padding: 5px 0 0 5px ; font-size: 1.2em ; } pre span { color: #560 ; } pre span.comment { color: #b30000 ; } ul#prod li p, .texte{ margin-top: 2px; padding-bottom: 2px; padding-left: 20px; line-height: 16px; background-color: #FF0000; background-image: url(../images/ok.gif); background-repeat: no-repeat; background-position: left center; border-top-width: 1px; border-bottom-width: 1px; border-top-style: solid; border-bottom-style: solid; border-top-color: #000000; border-bottom-color: #000000; text-align: center; } .imgz a img { display: inline;} html Bienvenue Pizzeria Pico Bello - Saint Louis - Restaurant Pizzeria

Menu au choix

Salade, plat et desserts

Menu Pâtes 9€
Menu Pizza 9.5€
Menu viandes ou poissons 10€

Newsletter

Inscrivezvous à la newsletter Pico-Bello et recevez un apéritif pour votre prochaine visite

Cliquez ici

Bienvenue Pizzeria Pico-Bello

Une décoration chaleureuse agrémente vos repas, entièrement refaite pour votre plus grand plaisir.
Le Pico-Bello peut désormais accueillir plus de 50 convives autour d'une cuisine traditionnelle Italienne uniquement réalisée avec des produits frais !

Site en construction

.....

.

voila les codes merci de votre aide

arthezius · Answer

Essai de mettre les tailles des polices en pixel au lieu de em.

audi68 · Answer

ok je vais essaier je te tiens au courant demain je dois aller bosser merci de ton aide

audi68 · Answer

bonjour
Je viens de le mettre a 20 pixel uniquement le menu et effectivement je n es plus se probleme

je vais donc mettre tous les tailles de polices en pixel

connait tu la difference entre pixel et ems?

par contre pour le cadre de gauche as tu une odée de quoi cela peut provenir?

merci de ton aide

arthezius · Answer

Sur div#bloccadre tu spécifie un 
margin: 0 30px 0 20px;  que tu ne met pas sur div#cadre. Essai de le mettre dessus également.

audi68 · Answer

je viens de le modifier

mais maintenant dans dreamweaver il est decalé comme sur l image de hier que tu m as montrer

mais sous IE 7 il est bon
pourrais tu me dire si sous IE 6 c est ok?

merci de ton aide

arthezius · Answer

T'a pas de margin sur div#bloccadre. ça viens peut-être ça. En fait sur le div#cadre, si tu met un margin 10 à droit, ça te fera 240+10 en largeur total. En plus tu as mis margin: 0 10px 0 0px; Pour que ça marche faut mettre: margin: 0px 10px 0px 0px; Toutefois, essai avec: margin: 0px; Celui de départ, tu l'avais mis uniquement sur le

audi68 · Answer

je viens de mettre margin 0px mais ca ne vas tjrs pas je suis decalé sur dreaweaver regarde ici http://picobello.free.fr/picocadre.jpg

c es bizare que ca ne marche pas

sous iE 6 c est comment?

merci de votre aide

arthezius · Answer

Met:

Menu au choix

Salade, plat et desserts

Menu Pâtes 9€
Menu Pizza 9.5€
Menu viandes ou poissons 10€

Et enlève l'image du fond du div "cadre". Vois ce que ça donne.

audi68 · Answer

je viens de faire ce que tu as dit mais c es pas encore ca il est decaler de quelque pixel
regarde ici http://picobello.free.fr/pico2.jpg

et j ai enleve le fond sur div cadre

merci

audi68 · Answer

je viens de trouver j ai agrandi la largueur de div cadre et div bloc a 255 et mis un marge sur bloaccadre p de 0px 15px 0px 0px et la c es devenu bon et la c es devenu bon IE 7 mais je ne sais pas sous IE6 

merci de votre aide c es tres gentil je ne savait pas que tu pouvais mettre une image comme tu m as dit merci beaucoup

arthezius · Answer

Là c'est bon.

Donc problème résolu.

audi68 · Answer

ok cool marci de votre aide

arthezius · Answer

De rien. On est là pour ça, donc n'hésite pas.

audi68 · Answer

ok pas de probleme je reviendrais

Probleme affichage parge web

35 réponses

Discussions similaires

Newsletters