Bonjour,
Je bosse comme un fou depuis plus d'une semaine sur le xhtml et bien que
cela avance, j'ai des soucis que je n'arrive pas à règler. Je recherche qq1
qui accepterait de m'aider dans mes erreurs.
Voilà ma page actuelle: http://www.vinyl-collector.com/TEST/
J'ai 2 soucis réccurents:
1. impossible de rendre identique la page selon IE ou Mozilla et Opéra
(espacement au niveau du menu de droite...) J'ai beau reprendre ma feuille
de style dans tous les sens y a rien à faire...
2. impossible de centrer verticalement le titre sur le header.
Je remercie d'avance tous ceux qui prendrait du temps pour m'aider. Qui plus
est, je voudrais savoir s'il existe déjà un bouquin référence sur les
feuilles de style. Bien que bcp de choses soient dispo sur le net,
j'apprécie d'avoir un bouquin avec moi...
Merci
Du XHTML1.1 fourni en text/html... C'est pas très bon ça.
Khône
Salut
1 - La différence entre IE et Mozilla vient certainement du fait qu'il n'interprête pas de la même manière les width, padding et margin. ex : #layer { width: 300px; margin: 10px; padding: 5px; } Pour IE, layer fait 300 pixels de large, avec des marges internes de 5 px et externes de 10px. Pour Mozilla, layer fait 330px de large (300 + 2*10 + 2*5). En résumé, pour mozilla la partie réservée au contenu est défini par width alors que pour IE elle est calculé à partir de width et padding, la marge s'appliquant ensuite. Il y a moyen de forcer IE à utiliser le même système que Mozilla, mais je ne me souviens plus ... (et puis d'ailleurs, je trouve le système IE plus logique - une fois n'est pas coutume)
2 - Tu as essayé vertical-align: middle; ?
3 - Subsidiaire Tu as une erreur dans ta feuille :
1 - La différence entre IE et Mozilla vient certainement du
fait qu'il n'interprête pas de la même manière les width, padding
et margin.
ex :
#layer
{
width: 300px; margin: 10px; padding: 5px;
}
Pour IE, layer fait 300 pixels de large, avec des marges internes de
5 px et externes de 10px.
Pour Mozilla, layer fait 330px de large (300 + 2*10 + 2*5).
En résumé, pour mozilla la partie réservée au contenu est défini par
width alors que pour IE elle est calculé à partir de width et padding,
la marge s'appliquant ensuite.
Il y a moyen de forcer IE à utiliser le même système que Mozilla,
mais je ne me souviens plus ... (et puis d'ailleurs, je trouve le système
IE plus logique - une fois n'est pas coutume)
2 - Tu as essayé vertical-align: middle; ?
3 - Subsidiaire
Tu as une erreur dans ta feuille :
1 - La différence entre IE et Mozilla vient certainement du fait qu'il n'interprête pas de la même manière les width, padding et margin. ex : #layer { width: 300px; margin: 10px; padding: 5px; } Pour IE, layer fait 300 pixels de large, avec des marges internes de 5 px et externes de 10px. Pour Mozilla, layer fait 330px de large (300 + 2*10 + 2*5). En résumé, pour mozilla la partie réservée au contenu est défini par width alors que pour IE elle est calculé à partir de width et padding, la marge s'appliquant ensuite. Il y a moyen de forcer IE à utiliser le même système que Mozilla, mais je ne me souviens plus ... (et puis d'ailleurs, je trouve le système IE plus logique - une fois n'est pas coutume)
2 - Tu as essayé vertical-align: middle; ?
3 - Subsidiaire Tu as une erreur dans ta feuille :
1 - La différence entre IE et Mozilla vient certainement du fait qu'il n'interprête pas de la même manière les width, padding et margin. Il y a moyen de forcer IE à utiliser le même système que Mozilla, mais je ne me souviens plus ... (et puis d'ailleurs, je trouve le système IE plus logique - une fois n'est pas coutume)
FAUDRAIT QUE JE TROUVE CE TRUC. JE VAIS CHERCHER
2 - Tu as essayé vertical-align: middle; ?
OUI MAIS CA MARCHE PAS.
1 - La différence entre IE et Mozilla vient certainement du
fait qu'il n'interprête pas de la même manière les width, padding
et margin.
Il y a moyen de forcer IE à utiliser le même système que Mozilla,
mais je ne me souviens plus ... (et puis d'ailleurs, je trouve le système
IE plus logique - une fois n'est pas coutume)
1 - La différence entre IE et Mozilla vient certainement du fait qu'il n'interprête pas de la même manière les width, padding et margin. Il y a moyen de forcer IE à utiliser le même système que Mozilla, mais je ne me souviens plus ... (et puis d'ailleurs, je trouve le système IE plus logique - une fois n'est pas coutume)
FAUDRAIT QUE JE TROUVE CE TRUC. JE VAIS CHERCHER
2 - Tu as essayé vertical-align: middle; ?
OUI MAIS CA MARCHE PAS.
loufoque
Message d'origine de Khône :
Il y a moyen de forcer IE à utiliser le même système que Mozilla, mais je ne me souviens plus...
Voici la solution, mais déjà ça ne fonctionne qu'avec IE6+. Il faut utiliser du HTML4.0Strict (text/html) ou du XHTML1.0Strict (text/html sans prologue XML ou text/xml avec prologue XML)
(et puis d'ailleurs, je trouve le système IE plus logique - une fois n'est pas coutume)
Moi je trouve celui du W3C plus logique. Comme quoi chacun ses goûts.
2 - Tu as essayé vertical-align: middle; ?
vertical-align: middle ne centre pas verticalement, à part dans le cas d'un bloc avec display: table-cell (bien sûr non supporté par IE)
Il y a différentes astuces pour le centrage vertical, comme par exemple celle des marges négatives
Message d'origine de Khône :
Il y a moyen de forcer IE à utiliser le même système que Mozilla,
mais je ne me souviens plus...
Voici la solution, mais déjà ça ne fonctionne qu'avec IE6+.
Il faut utiliser du HTML4.0Strict (text/html) ou du XHTML1.0Strict
(text/html sans prologue XML ou text/xml avec prologue XML)
(et puis d'ailleurs, je trouve le système
IE plus logique - une fois n'est pas coutume)
Moi je trouve celui du W3C plus logique.
Comme quoi chacun ses goûts.
2 - Tu as essayé vertical-align: middle; ?
vertical-align: middle ne centre pas verticalement, à part dans le cas
d'un bloc avec display: table-cell (bien sûr non supporté par IE)
Il y a différentes astuces pour le centrage vertical, comme par exemple
celle des marges négatives
Il y a moyen de forcer IE à utiliser le même système que Mozilla, mais je ne me souviens plus...
Voici la solution, mais déjà ça ne fonctionne qu'avec IE6+. Il faut utiliser du HTML4.0Strict (text/html) ou du XHTML1.0Strict (text/html sans prologue XML ou text/xml avec prologue XML)
(et puis d'ailleurs, je trouve le système IE plus logique - une fois n'est pas coutume)
Moi je trouve celui du W3C plus logique. Comme quoi chacun ses goûts.
2 - Tu as essayé vertical-align: middle; ?
vertical-align: middle ne centre pas verticalement, à part dans le cas d'un bloc avec display: table-cell (bien sûr non supporté par IE)
Il y a différentes astuces pour le centrage vertical, comme par exemple celle des marges négatives
ca ca marche.merci beaucoup. pour le reste, je crois que je vais pas migrer à 100% aux div mais que je vais garder la mise en page par tableau pour le menu, la gestion des div ne me paraissant pas encore optimale (différences assez conséquente au niveau du menu - gestion des marges). Merci pour le reste! Julien
ca ca marche.merci beaucoup.
pour le reste, je crois que je vais pas migrer à 100% aux div mais que je
vais garder la mise en page par tableau pour le menu, la gestion des div ne
me paraissant pas encore optimale (différences assez conséquente au niveau
du menu - gestion des marges).
Merci pour le reste!
Julien
ca ca marche.merci beaucoup. pour le reste, je crois que je vais pas migrer à 100% aux div mais que je vais garder la mise en page par tableau pour le menu, la gestion des div ne me paraissant pas encore optimale (différences assez conséquente au niveau du menu - gestion des marges). Merci pour le reste! Julien
Thibaut Allender
on 4/04/2004 15:34, Khône wrote :
1 - La différence entre IE et Mozilla vient certainement du fait qu'il n'interprête pas de la même manière les width, padding et margin. ex : #layer { width: 300px; margin: 10px; padding: 5px; } Pour IE, layer fait 300 pixels de large, avec des marges internes de 5 px et externes de 10px. Pour Mozilla, layer fait 330px de large (300 + 2*10 + 2*5).
non, pas avec IE6 si on travaille en xhtml strict le box model est alors identique pour les 2
1 - La différence entre IE et Mozilla vient certainement du
fait qu'il n'interprête pas de la même manière les width, padding
et margin.
ex :
#layer
{
width: 300px; margin: 10px; padding: 5px;
}
Pour IE, layer fait 300 pixels de large, avec des marges internes de
5 px et externes de 10px.
Pour Mozilla, layer fait 330px de large (300 + 2*10 + 2*5).
non, pas avec IE6 si on travaille en xhtml strict
le box model est alors identique pour les 2
1 - La différence entre IE et Mozilla vient certainement du fait qu'il n'interprête pas de la même manière les width, padding et margin. ex : #layer { width: 300px; margin: 10px; padding: 5px; } Pour IE, layer fait 300 pixels de large, avec des marges internes de 5 px et externes de 10px. Pour Mozilla, layer fait 330px de large (300 + 2*10 + 2*5).
non, pas avec IE6 si on travaille en xhtml strict le box model est alors identique pour les 2
*OUIFFI* <(nospam)(nospam)> a écrit dans le message : 406fcf3c$0$14427$
Bonjour,
Salut,
1. impossible de rendre identique la page selon IE ou Mozilla et
Opéra
(espacement au niveau du menu de droite...) J'ai beau reprendre ma
feuille
de style dans tous les sens y a rien à faire...
Oui, c'est trés difficile (voire impossible) d'obtenir un rendu identique entre différents navigateurs. Mais ce n'est pas à cause des standards :)
2. impossible de centrer verticalement le titre sur le header.
Tu devrais trouver une technique ici : http://www.openweb.eu.org/articles/initiation_centrage/
Question bouquin, "HTML & XHTML" chez O'Reilly est assez complet (j'ai quelques critiques cependant). Chez Eyrolles et d'autres tu trouveras aussi de bons ouvrages. Au fait, tu peux toujours imprimer http://www.openweb.eu.org :)
*OUIFFI* <(nospam)contact@ouiffi.com(nospam)> a écrit dans le message
: 406fcf3c$0$14427$626a14ce@news.free.fr...
Bonjour,
Salut,
1. impossible de rendre identique la page selon IE ou Mozilla et
Opéra
(espacement au niveau du menu de droite...) J'ai beau reprendre ma
feuille
de style dans tous les sens y a rien à faire...
Oui, c'est trés difficile (voire impossible) d'obtenir un rendu
identique entre différents navigateurs.
Mais ce n'est pas à cause des standards :)
2. impossible de centrer verticalement le titre sur le header.
Tu devrais trouver une technique ici :
http://www.openweb.eu.org/articles/initiation_centrage/
Question bouquin, "HTML & XHTML" chez O'Reilly est assez complet (j'ai
quelques critiques cependant). Chez Eyrolles et d'autres tu trouveras
aussi de bons ouvrages.
Au fait, tu peux toujours imprimer http://www.openweb.eu.org :)
*OUIFFI* <(nospam)(nospam)> a écrit dans le message : 406fcf3c$0$14427$
Bonjour,
Salut,
1. impossible de rendre identique la page selon IE ou Mozilla et
Opéra
(espacement au niveau du menu de droite...) J'ai beau reprendre ma
feuille
de style dans tous les sens y a rien à faire...
Oui, c'est trés difficile (voire impossible) d'obtenir un rendu identique entre différents navigateurs. Mais ce n'est pas à cause des standards :)
2. impossible de centrer verticalement le titre sur le header.
Tu devrais trouver une technique ici : http://www.openweb.eu.org/articles/initiation_centrage/
Question bouquin, "HTML & XHTML" chez O'Reilly est assez complet (j'ai quelques critiques cependant). Chez Eyrolles et d'autres tu trouveras aussi de bons ouvrages. Au fait, tu peux toujours imprimer http://www.openweb.eu.org :)