Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

Recherche d'un parrain !!!! Pb de débutant...

8 réponses
Avatar
*OUIFFI*
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

8 réponses

Avatar
loufoque
Du XHTML1.1 fourni en text/html...
C'est pas très bon ça.
Avatar
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 :

#header span {
padding-top:20px;
padding_bottom:-50px; => padding-bottom
}

Khône
Avatar
*OUIFFI*
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.
Avatar
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
Avatar
Maurice Svay
*OUIFFI* a écrit :

2 - Tu as essayé vertical-align: middle; ?



OUI MAIS CA MARCHE PAS.



essaie de mettre

#header span {
position:absolute;
line-height:50px;
}
Avatar
Julien Trotoux
#header span {
position:absolute;
line-height:50px;
}




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
Avatar
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

--
thibaut allender | freelance | web|system developer|designer
+32 496 26 75 76 | http://capsule.org
Avatar
John Lenomade
*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 :)