Problème Xhtml/Css

[Hoaxyde]

Salut,

la page ci dessous était très bien. Hier j'ai rajouté un <h1> pour qu'elle soit mieux référencée. Ca marchait sous Firefox, mais pas sous IE, ce qui pose un problème vu qu'une majorité de personnes est sur ce Broswer.
J'ai procédé à un nettoyage du code, mais maintenant, ça ne marche même plus sous Firefox (et non plus sous IE). En fait, le texte est à gauche au lieu d'être à droite, vous le verez bien.
Sur les autres pages, pas de <h1>, et ça marche.

Si une âme charitable pouvait voir ce qu'il faut changer à la page Xhtml et/ou à la CSS, ce serait adorable .
C'est assez embetant que la page soit actuellement médiocre, et illisible.

Merci beaucoup, vous me sauverez la vie, la je suis dans le cambouis...

http://cabinetmedicaljoffre.free.fr/pag ... renard.php
http://cabinetmedicaljoffre.free.fr/design.css

++

[olab]

Je crois qu'il ne faut pas que tu utilises position: relative si tu veux que ça fonctionne sous IE, il me semble qu'il ne le comprend pas.

[Hoaxyde]

Pour quelque calque ? Et pour Firefox ?

Merci

[olab]

Tu l'as utilisé pour de nombreux calques (tiens c'est un anagramme de claques ). Quant à FFox je ne sais pas dans quelle mesure il gère le relative. Va falloir attendre d'autres experts

[Hoaxyde]

Le problème n'est pas la, sans le <h1>, ça marchait très bien. C'est depuis que je l'ai rajouté que ça buggue. Donc c'est cette balise qui pose pb, comment faire ?

[Benoit]

Il y avait quoi avant le h1? Rien?

Essaie peut-être simplement

Code : Tout sélectionner

h1 {display: inline; padding:0; margin:0;}

[calimo]

Ta page n'est pas valide ... http://validator.w3.org/check?uri=http% ... renard.php
Tu ne peux pas imbriquer des p et des hx (ni des p et des p d'ailleurs)

<p class="p1"><h1>

A ta place je mettrais tous les <div> en "position:absolute" et je les positionnerais un-à-un avec top, left et éventuellement right et bottom.
Par exemple :

Code : Tout sélectionner

#préambule {position:absolute;margin-left:200px;}

Où tu remplaces 200px par la largeur de #linklist.

Si tu as des problèmes de marges, n'hésite pas à toutes les écraser avec

Code : Tout sélectionner

* {
margin:0px;
padding:0px;
[etc.]
}

Pour les images il ne faut pas avoir peur de les mettre :

Code : Tout sélectionner

XHTML:
<h3>Bienvenue sur le site du Cabinet M&eacute;dical Joffre</h3>
CSS:
#preamble H3 {
	BACKGROUND: url(bienvenue.gif) no-repeat; WIDTH: 750px; HEIGHT: 25px
}

peut devenir

Code : Tout sélectionner

<h3><img src="bienvenue.gif" alt="Bienvenue sur le site du Cabinet M&eacute;dical Joffre" /></h3>

C'est plus court ça a le même effet et c'est beaucoup plus simple (y-compris à gérer). L'élément img n'est pas obselète en xhtml

Dernière chose : est-ce vraiment vital ?

Code : Tout sélectionner

        <p style="display:none;"><strong>dr renard</strong>, <strong>docteur</strong> 
        renard, <strong>docteur vincent renard</strong>, dr, <strong>médecin</strong> 
        renard, vincent renard, RENARD vincent</p>

	 </p>

[Hoaxyde]

Benoît, ça ne marche pas

Calimo, mon but n'est pas que ça soit valide
Et je ne veux pas changer les <div>, ça marchait très bien sans mon <h1>...

Et j'ai pas le temps de restructurer tout le site. Pour ton dernier point, oui c'est obligé

[calimo]

mon but n'est pas que ça soit valide

J'en conclus que ton but n'est pas d'avoir un affichage correct...
Valider n'est pas un but en soi, mais c'est le premier pas pour avoir un affichage "prévisible".
Là avec ton h1, il se peut que le moteur Gecko "voie" <p class="p1"></p><h1>etc. ce qui évidemment ne peut que poser des problèmes

Pour ton dernier point, oui c'est obligé

Alors place-le au moins après le menu 8)

[Hoaxyde]

Ah bé oui, tu avais raison, mais j'avais pas compris. En mettant le h1 avant le paragrae, j'ai trouvé la CSS qu'il fallait.

Merci à tous