28173 sujets

CSS et mise en forme, CSS3

Bonjour!

Sur tous les sites, on dit que max width et min-width sont valables avec IE7 .
J'ai créé un module dont le code css est:

.moduletable-actualite {  
background-image: url(../images/orange.gif);  
background-position: top left;
background-repeat: no-repeat;
text-align: right;
width: 100%;
max-width: 250px;
margin-left:auto;
margin-right:auto;
padding: 0px;
border :1px double #fc9404;
float: right; 
               
}


Max width marche bien avec FF, mais pas avec IE7, qui affiche le module en 100%.

J'ai cru voir qu'il y avait peut etre un problème de Doctype?

Mon doctype est en
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">


Le problème vient-il du fait qu'il ne s'agit pas de XHTML Strict???

merci
Modifié par mim20 (03 Mar 2008 - 10:15)
Administrateur
Bonjour,

non le type de Doctype n'influe pas sur la prise en compte de min/max width/height par IE7, à ma connaissance.
Par contre s'il s'agit du site que tu as indiqué dans ton profil ('www' -> fudiad.info), le Doctype est précédé par le prologue XML:
<?xml version="1.0" encoding="iso-8859-1"?>

ce qui pose de sérieux problèmes au moins dans IE6 (il ignore le Doctype dans ce cas).
Je ne connais pas les conséquences pour IE7, parce que j'ai toujours des pages avec un Doctype pris en compte et valides et que je ne me suis pas renseigné sur ce que ça provoquait dans le cas contraire Smiley ohwell .

Ta page n'est pas valide d'après le validateur du W3C, il y a en vrac une absence d'encodage des URL et des paramètres (& => &amp; bizarre que Joomla ne gère pas ça ??), des attributs de présentation dans le code HTML au lieu de faire appel exclusivement à CSS, ce qui est obsolète (align=justify), etc
Difficile de savoir comment se comporte IE7 dans ce cas, et c'est peut-être pas du tout de là que vient le problème non plus ... Aurais-tu une URL à nous indiquer où serait présent ce fameux module?
Bonjour,

Je viens de vérifier sur une page de test le comportement d'Internet Explorer 7 en présence d'un width: 100% et d'un max-width, eh bien ce dernier est bien pris en compte tant que la page est affichée en mode standard et non pas en mode Quirks.

J'ai également testé avec ton code CSS et le Doctype que tu indiques, et aucun ne pose problème.

J'ai également testé avec un prologue XML, et ce dernier ne pose aucun problème à IE7. Le bug du prologue XML qui déclenche le mode Quirks a été corrigé pour IE7, donc le problème ne vient à priori pas de là.
Virer les prologues XML inutiles (en gros tant qu'en envoie ses pages en "text/html", ce prologue est inutile) reste une bonne idée, pour la compatibilité IE6.

Pour le max-width, tu as bien testé avec IE7 et pas avec IE6?
Bonjour

Merci d'avoir étudié le problème. Au final, comme personne ne répondait, j'ai contourné le problème en présentant les modules d'une autre manière. Ceci dit, j'avais bien vérifié plusieurs fois: oui, le test a bien été fait avec IE7. Peut etre était-ce un probleme de float?car malgré tous les tuto disponible, j'avoue que j'ai parfois tendance à m'embrouiller.


Quoi qu'il en soit, je suis bien entendu volontaire pour améliorer le doctype, mais j'avoue que je suis un petit peu perdue dans tout ça.
Je viens de vérifier avec http://validator.w3.org/, et le script est effectivement totalement invalide.
En fait, le template de base a été acheté, et les seules modifications que j'ai faites sur le documents sont: l'ajout de div, l'insertion de tag nécessité par certains modules, un tag pour crawltrack il me semble, et l'insertion d'un conditionnel pour IE6.
Par conséquent, il me semble bien que
<?xml version="1.0" encoding="iso-8859-1"?>
se trouvait dans le template original, mais je vais quand même vérifier.

Quelques questions:
1)-
a écrit :
e Doctype est précédé par le prologue XML:

<?xml version="1.0" encoding="iso-8859-1"?> ce qui pose de sérieux problèmes au moins dans IE6 (il ignore le Doctype dans ce cas).


Pourtant, pour l'instant, j'ai reussi à corriger tous les bugs dus à IE6, avec les conseils d'Alsacreation!! J'ai introduit par exemple un "If...", exprès pour IE6, et celui-ci l'a pris en compte...

2)
a écrit :
une absence d'encodage des URL et des paramètres (& => & bizarre que Joomla ne gère pas ça ??), des attributs de présentation dans le code HTML au lieu de faire appel exclusivement à CSS, ce qui est obsolète (align=justify), etc

Pourrais-tu préciser de quoi il s'agit??

3)
a écrit :
Virer les prologues XML inutiles

Comment faire?

4) sinon, pour résumer, peut etre aurais-tu un lien à me donner qui pourrait m'aider à rendre ma page valide?

Merci!
mim20 a écrit :
Pourrais-tu préciser de quoi il s'agit??

Le caractère «&» (esperluette, ampersand en anglais) est un caractère spécial en HTML. Il sert à introduire les entités HTML telles que &eacute; ou &#8212;. Pour écrire un «&» littéral, il faut utiliser l'entité caractère &amp;. Cela vaut également pour les «&» que l'on trouve dans les URL.

mim20 a écrit :
Virer les prologues XML inutiles

Comment faire?
Heu... en les supprimant dans tes templates, par exemple?

mim20 a écrit :
4) sinon, pour résumer, peut etre aurais-tu un lien à me donner qui pourrait m'aider à rendre ma page valide?

Tu l'as déjà: http://validator.w3.org
Le validateur donne des explications et des pistes pour chaque erreur rencontrée. Ça peut être utile de se pencher sur ces explications.
Il suffit donc dans un premier temps de supprimer:
<?xml version="1.0" encoding="iso-8859-1"?>
? et après de s'attaquer une par une aux erreurs détectées?
Je vais potasser sérieusement tout ça.


Merci!!

Après un examen attentif, je me suis aperçu que 98% des fautes viennents..des modules de Joomla...que je ne suis pas en mesure de modifier..tant pis!
Modifié par mim20 (03 Mar 2008 - 16:36)