28220 sujets

CSS et mise en forme, CSS3

Bonjour,
Comme je suis apprenti-rameur dans la galère de la conception de site en HTML-CSS (j'ai ouvert un éditeur html pour la première fois il y a une semaine...) j'aimerais vraiment débuter sur de bonnes bases.

J'ai fait ça: http://www.opfa.org/essai

Ce serait gentil de me dire s'il y a des aberrations, des monstruosités, des trucs à éviter absoluement.

Travaillant sous mac, j'ai testé sous FireFox, Safari, et IEmac, et les trois m'affichent la même chose Smiley biggrin , mais il semblerait que IEPC ce soit la cata...

Qu'est-ce qui cloche exactement?
Modifié par firfelin (03 Nov 2005 - 09:59)
Si ce que tu vois dans ton navigateur est ce que tu comptais obtenir, je dirais que tu es parti sur de bonnes bases. Le code XHTML et CSS est propre et reste lisible (accessible) en desactivant le CSS.

J'ai trouvé un peu étrange l'utilisation de certains attributs pour la balise h1
position: relative;
top:-6px;
left:-2px;
Cela te fait coller les titres en bordure de ton div (effet probablement voulu pour le titre du haut) mais impactera tout les h1. l'utilisation d'une classe aurait peut-être été plus adapté. Mais why not, si c'est ce que tu veux faire.

J'ai supposé que tu avais juste oublié de supprimer les 3 lignes du bas de ton CSS a:... Lignes qui ne servent à rien.

Bon courage


Bien sur il faudra voir ce que cela donne quand tu complexifiras ton site.
Merci pour la réponse et les encouragements Smiley biggrin

Alors pour le titre, c'est normal et voulu Smiley ravi

Les lignes qui ne servent à rien... c'est que j'ai pas fini de tout "styler"

Je suis assez content du résultat pour une première tentative, et ça me rassure de voir que je n'ai apparemment pas fait complètement n'importe quoi.

Mais IE PC me l'affiche tout cassé, et je ne sais pas pourquoi.
J'ai bien lu tout un tas de choses sur les bugs d'IE, mais je ne sais pas quelle partie de mon code pose problème exactement...

Est ce qqn serait assez aimable pour m'indiquer quelles parties sont problématiques dans mon code?

Merci d'avance
Je n'ai pas d'IE accessible actuellement, mais je pense que c'est l'utilisation du margin-left qui te pose un problème. Je crois avoir eu quelque chose de similaire il y a quelques temps (un truc du style que pour IE la marge est à l'intérieur de bloc et du coup tu décales tout de 25px, donc la somme de tes div est dupérieur à la largeur de la page et ils apparaissent donc l'un au-dessous de l'autre)

Si personne d'autre ne se manifeste, tu pourrais essayer de positionner tes bloc de telle sorte que que tu n'aies pas besoin d'utiliser de margin-left, pour voir

A suivre
Bonjour,
je suis d'accord avec Merlin, ton problème vient effectivement d'un problème de calcul de dimension de boîte.
Tu as spécifié une largeur à ton conteneur, et pour toi la somme des largeurs de ses enfants est égale à cette largeur.
Mais comme tu as ajouté des marges, le calcul de ces largeurs varie selon les navigateurs.
Tu trouveras une explication sur les dimensions de boîte sur openweb:
http://www.openweb.eu.org/articles/dimensions_boites_css/

bonne journée