Problème css IE6 et problème centrage tout IE

Bonjour, c'est la première fois que je post sur le forum, mais je regarde très souvent, c'est une mine d'information.
Je précise avant de commencer que je suis débutant.

Mon premier problème n'apparait pas sous firefox, mais sous tout IE

Mon texte n'est normalement pas centré sous Firefox, mais il est centré sous IE.
Je voudrais qu'il ne soit pas centré sous IE

SOUS IE



SOUS FIREFOX



Mon deuxième problème est pour les traits rouge sur le coté, sous Firefox, IE 8 pas de souci, par contre sous IE6 j'ai un léger bug d'affichage qui n'est pas jolie du tout



SOUS IE6




SOUS IE 8 et FIREFOX pas de souci



l'url du site http://pizzalatosca.fr/pizzas.html
Merci pour votre aide précieuse

Cyrille
Modifié par cyrille31 (17 Aug 2010 - 18:22)

Hello Cyrille et bienvenue,

les images c'est bien... mais ça ne nous aide pas du tout. Il faudrait plutôt nous montrer une page en ligne ou, à défaut, tout le code html et css nécessaire pour reproduire le problème.

J'ai ajouté l'url du site. Pour le code, je peux poster les css et l'html de ma page ?

cyrille31 a écrit :
J'ai ajouté l'url du site. Pour le code, je peux poster les css et l'html de ma page ?

Avec la page en ligne on a déjà tout à disposition... je jette un œil.

Arf ! Désolé mais je jette l'éponge : tu as jusqu'à 4 niveaux de tables imbriquées et ça me prendrait un temps fou de tout décortiquer (je t'invite à lire Construire un site sans tableaux).

Donc je passe la main.

Bonjour,

Je commencerais pas corriger les erreurs de code (qui peuvent poser problème à certains navigateurs).

Ce n'est pas vraiment la peine de faire ce genre de code :

<td><span class="pizzas">REGINA :</span></td>

Tu pourrais déjà simplifié par :

<td class="pizzas">REGINA :</td>

Après un simple style doit tout mettre en place

td.pizzas 
{  text-align: left ;
}

Tu devrais effectivement simplifier ton code.

J'ai ça dans mon css

.pizzas
{
	font-variant: small-caps;
	font-family:MyriadPro-Regular;
	color:#fa0000;
	font-size: 20px;
	font-weight: bold;
	text-align:left
}

Est qu'il faut que j'ajoute quand meme

td.pizzas  
{  
text-align: left ; 
}

Ce que je veux dire c'est que le

text-align:left

y est déjà

Si oui, je vois pas comment l'ajouter dans la page html

Et merci pour votre aide c'est vraiment sympa.
Je metrise pas encore bien tout ca... (mais vous l'aurez compris)
Modifié par cyrille31 (17 Aug 2010 - 22:14)

Le pb, c'est qu'un span n'est pas un bloc, ça entoure uniquement le texte au plus près. Donc si tu mets un align left, à l'intérieur c'est trop tard, c'est l'alignement du TD qui compte.

Vu ton css, si tu enleves le span, ça doit marcher.

C'est clair que le SPAN ne sert à rien mais ça ressemble bien à un bug (même dans IE8) puisque tous les éléments du tableau devraient hériter du text-align:left de .main


Edit: en même temps je suis un peu rapide à parler de bug... comme le disait Laurie-Anne plus haut tu y verrais plus clair en corrigeant les erreurs de validation.
Modifié par Heyoan (17 Aug 2010 - 23:25)

J'ai enlevé les SPAN, ce qui a révélé que j'avais un text-indent: 150px; dans .descriptions.
Ce qui fait que sur Firefox, j'avais la premiere ligne décalé sur la droite, parfait, je l'ai enlevé.
Sous Firefox c'est bon

Sauf que sur IE, .pizzas, est bon, mais .description est toujours centré.

On avance petit à petit

Je vais regarder s'il n'y a pas un center quelque part.

Merci, pour ton aide.

Si un jour tu décides de suivre les conseils que l'on te donne, fais nous signe...

Bonjour, ca n'est pas que je ne veux pas suivre tes conseils, mais je ne vois pas ou sont les erreurs dont tu parles.

Suis le lien que t'as donné Heyoan, il mène directement vers la page de résultat du validateur.

Ok, il me reste 4 erreurs, mais je vois pas comment les corriger.
J'ai toujours le même soucis sous IE le texte description est centré, et pas sous Firefox.
Je vais corriger les erreurs sur les autres pages.

Merci

cyrille31 a écrit :
Ok, il me reste 4 erreurs, mais je vois pas comment les corriger.

Soit tu remplaces ton doctype Strict

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

par un doctype Transitional

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Soit tu ne t'en occupes pas puisqu'elles sont sans importances : cf. cet article sur le DOCTYPE.

Pour le texte centré c'est le même problème et la même solution :

.descriptions
{
	...
	text-align: left;
}

Effectivement avec tout ça, j'avais zappé,

.descriptions 
{ 
    ... 
    text-align: left; 
}

c'est fait, et mon texte, est bien affiché.

Pour le doctype, j'ai mis Transitional, toout est au vert.

Je suis en train de regarder maintenant ce problème avec les barres sur les cotés, je comprends pas du tout, parce que par exemple pour les pizz crème l'affichage est parfait alors que pour les autres il y a un petit décalage, sur IE il est à gauche, et sur firefox à droite...

Je comprends pas vraiment d'où ça vient, surtout que j'ai fais des copié collé des tableaux, ils devraient tous être identiques.

J'ai a nouveau une question sur la page http://www.pizzalatosca.fr/desserts-boissons.html
pour ne pas avoir a redimensionner les traits de chaque coté du tableau, j'ai essayé du coté droit de mettre l'image en background, mais elle n'apparait pas.
j'ai mis ce code dans le CSS

.cotedesserts
{
background:url(images/desserts/images/cote_desserts.png) repeat-y;
}

et j'ai mis ce code dans la page html

<td  class="cotedesserts"></td>
 <!-- <td><img src="images/desserts/images/cote_desserts.png" alt="" width="3" height="1300" /></td>-->

Peut-etre avez vous une idée.
Merci à tous.
Modifié par cyrille31 (18 Aug 2010 - 18:51)

C'est bon pour presque tout, il me reste juste un soucis sur la page

http://www.pizzalatosca.fr/desserts-boissons.html

Il y a un gros décalage sur la gauche, je ne vois pas du tout pourquoi, et ca ne le fait que sur IE toute version.

Si vous avez une idée.
Je fini d'enlever les erreur du validateur, et ca sera super bon et enfin fini.

Je vous remercie toutes et tous pour votre aide, j'ai appris pleins de choses avec ce projet.

Autant les erreurs qui concernent bgcolor et autre align=center ne sont pas bien graves, autant celles qui parlent d'éléments non fermés sont susceptibles de poser problème puisque cela oblige le navigateur à essayer de les fermer lui-même... et que ça ne marche pas toujours très bien.

Sinon il faudrait voir à optimiser tes images car 600ko pour une page ça fait beaucoup.