1

Souhaitant mettre un petit : firefox-wide.png je me dois de faire en sorte que l'affichage souit correct sous ce naviguateur ... Or j'ai quelque soucis depuis mon passage d'IE à Firefox. Un site que j'ai créé n'affiche pas correctement les menus :

bad.gif


et ça devrait être ça :

wrong.gif


J'ai cherché longtemps des problèmes de marges mais je ne vois pas ce qui ne va pas sad Si vous pouviez m'aider merci le site est ici : www.sa-courteille.com
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

2

Sans conviction:
Essais d'enlever les sauts de ligne dans le code avant et après les <p...> et </p> (me demande pas pourquoi).
Essais aussi sans "<p class=...>" remplace par un <li> par exemple.

3

Bah tu n'imposes pas de dimension verticale a ce que j'ai pu rapidement voir (et flemme de regarder plus en détails) alors le navigateur prend ses aises et étend la cellule...
Essaye de mettre "padding: 0" et/ou d'imposer une hauteur fixe et regarde ce que ça donne, je pense que ça devrait suffire.

(Enfin perso je trouve que la "version firefox" est largement mieux, excepté le fait que l'image soit trop petite... tongue)
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

4

du genre :p { margin: 0; padding:0; } J'ai essayer un mettant un truc
...</p> de la page. Alors ensuite j'ai voulu faire :p.titre_menu { margin: 0; padding:0; } Le truc c'est que ça me foire toute mes <p>
mais voila ça change rien : mes <p class="titre_menu">...</p> reviennent à un <p>...</p> sans changement de margin ou de padding : c'est à dire mal affiché.
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

5

C'est pas le <p> mais le <td> je pense...
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

6

Non plus car en le mettant en margin et en padding nul ça change rien : j'ai toujours le problème.
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

7

Au fait merci GUNNM mais ça ne change rien neutral.
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

8

En fait je viens de voir ça... (sick quand même...)
                <td height="18" background="images/img_design/bk_rubrique.gif"
                 style="border-top: 1px solid rgb(149,147,164); border-bottom: 1px solid rgb(149,147,164)"
                 valign="bottom" align="right">
                  <font color="#524D6C">
                    <p align="right"><img src="images/img_design/puce1.gif" width="11" height="11">
                  </font>
                </td>

T'as essayé de le retirer pour voir ce que ça faisait ? Y'a une petite chance que ton problème vienne (en partie au moins) de là
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

9

Merci !! Ok donc le problème venait du fait que je m'attaquer à un <p> mais pas au bon ! Vraiment : merci beaucoup !
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

10

Au fait comment faire pour qu'un conteneur positionné en absolute soit considéré comme du contenu dans le conteneur supérieur? En fait mon problème c'est que j'ai un div principal pour la page (un cadre simple) puis une colonne gauche et une autre droite mais le problème c'est que le cadre de la page n'encadre pas les colonne puisqu'elles sont positionnées en absolute
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

11

En fait... c'est pas possible... Ou bien en "position: absolute;" tu es placé sur la page entière, ou bien en "position: relative;" tu es placé dans le conteneur, mais relativement à la position originale de l'objet :/
Je sais pas exactement ce que tu cherches a faire, donc je peux pas trop t'aider, mais je suis sur que ton problème a une solution happy
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

12

J'essai de faire un site dans les règles de l'art c'est à dire sans tableau mais une structure un 2 colonne me pose problème : soit ça rend pas comme il faut soit ça rend pas vraiment top (dépassement de cadre etc ...) Pour voir ou j'en suis c'est ici : http://cyril.mottier.free.fr/extern/test_galerie/test_galerie.htm
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

13

Tu devrais regarder ça c'est assez intéressant [Lien], particulièrement le tutorial 8 happy
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

14

Merci encore mais en réalité c'est un peu la structure que j'avais déja et elle en fon citonne pas.. sad En fait je veux mettre mon contenu à gauche et la colonne de naviguation à droite : c'est l'inverse de l'exemple du tutorial. Pour les gens qui aurait du temps pour m'aider c'est ici : http://cyril.mottier.free.fr/extern/test%20galerie%202/test_galerie.htm. En clair : l'affichage buggue totalement sous IE et sous Firefox il y a un décalage de l'écriture en haut de colonne de droite
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

15

En fait le décalge de l'écriture était du à une erreur de ma part dans le calcul de la marge de gauche ... Mais le problème concernant l'affichage IE reste toujours là !

[edit] OK bon : il semblerait que IE et Firefox n'est pas la même définition du div : IE semble inclure le border dans le div mais pas Firefox .. conclusion l'affichage n'est pas le même .. Au fait : un avertissement dans une feuilles CSS : c'est considéré comme un échec à la validation ?
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

16

Thor
: [edit] OK bon : il semblerait que IE et Firefox n'est pas la même définition du div : IE semble inclure le border dans le div mais pas Firefox .. conclusion l'affichage n'est pas le même ..
Bug connu du box model... Firefox gère ça de la manière correcte, IE non par défaut :/
Pour que ça fonctionne correctement sous IE 6+ tu dois mettre un DOCTYPE qui lui convienne (fais une petite recherche google pour trouver ce qu'il te faut)
un avertissement dans une feuilles CSS : c'est considéré comme un échec à la validation ?
A priori si le validateur te dit que c'est valide, ben considère que ça l'est... Maintenant je suis pas certain de comprendre les avertissements qu'il te donne grin
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

17

OK merci GoldenCrystal mais tout compte fait : je passe énormément de temps à essayer de faire un site sans <table> mais je me rend compte que je n'ai pas le niveau pour éviter ses balises totalement : en effet elles permettent un positonnement beaucoup plus précis (au pixel prés et sans changement de considération suivant le browser) que les div... Je crois que je vais abandonner mon idée d'essayer de faire un site qui suit exactement les standards : c'est trop difficile.
Cyril Mottier [Etudiant à l'Institut National des Sciences Appliquées (INSA) de Rennes]
Mon site perso c'est ici
Tuto sur l'utilisation de Vertel3 : Cliquez ici

18

Ben... Tout dépend de ce que tu veux faire précisément... Mais dans l'état actuel des choses il existe encore pas mal de choses qu'on ne peut pas faire avec des div... (Enfin si les navigateurs supportaient tous entièrement la propriété display, y'aurait aucun problème)
En principe, le css devrait permettre de séparer entièrement le contenu de sa présentation, mais en réalité ça ne marche pas vraiment comme ça...
Le fait d'imbriquer des div entre eux déjà, c'est inclure de la présentation dans ton document, donc au final, que ça soit un <div> ou un <table> beaucoup moins flexible que tu décides de mettre ça change plus grand chose sad (Ce qui ne veut pas dire qu'il ne faut pas mettre le maximum de présentation a l'intérieur du css plutôt que sur la page elle-même, ne serait-ce que par souci de flexibilité)
Une bonne solution à ça est le xml/xslt, mais faire un site en xml avec ou sans xslt... je pense pas que ça soit utile et profitable à tout le monde tongue
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

19

En principe, le css devrait permettre de séparer entièrement le contenu de sa présentation, mais en réalité ça ne marche pas vraiment comme ça...
Intéressant ça. c'est aussi ce qu'il me semblait, mais je n'ai toujours pas trouvé comment inverser l'ordre des éléments fils d'un élément.

Par contre, si l'imbrication des div a un sens dans la mesure où elle traduit une relation d'appartenance. Par exemple avoir un <div class="message"> contenant un <div class="author">, un <div class="date">, ... est tout à fait justifié.