5568 sujets

Sémantique web et HTML

Bon voila marre des tables dans des tables alors me voila!
Je me met au xhtml pour les créations de mes sites. Bon je sais il était temps mais bon voila quoi pas le temps et la simplicité avec les tables dans des tables.
Maintenant c décidé ! Des div, des css et du standard !

Par contre forcément comme tout débutant. un ptit peu besoin d'aide !

Voici le site que je suis en train de préparer en xhtml : http://v2.promo-flyer.com

le problème est que je n'arrive pas a le faire valider par la W3C et que j'ai quelques bugs d'affichage nottament sur firefox. Ce dernier est surtout genant sur la page des CGV (http://v2.promo-flyer.com/Lentreprise/CGV/tabid/79/language/fr-FR/Default.aspx). Sur ie ça passe mais sur firefox il n'y a que le blanc au centre qui s'etire et sur les marges gauche et droite ça ne le fait pas :s en plus le pied de page reste a la meme position et du coup n'est plus en bas mais est melangé avec le texte central. J'ai essayé avec ou sans les width=100% a diferent endroits (body, dans mon div warp etc) pas moyen

Ce serait cool d'aider un debutant comme moi hihihi

merci
Modifié par djh3o (03 Mar 2008 - 12:53)
Bonjour djh3o et bienvenue sur Alsacréations Smiley smile ,

Pour bien débuter il faudrais mieux modifier le titre de ton sujet pour quelque chose de plus parlant quant au problème que tu rencontres (bouton "éditer" en haut à droite de ton message).
merci raphael pour ton poste... Bon si j'ai bien compris j'ai faillit aller dans le "c pas gagné". ouf tu m'a peut etre sauvé de la divité Smiley langue
Bon alors sinon conseil par rapport a la structure du lien que j'ai fillé! Div ou table?
Pour la page avec le fond blanc qui ne s'étend pas jusqu'en bas:
- Tu as des height:100% parasites un peu partout. Les éradiquer sans autre forme de procès.
- Tu as un problème de dépassement des éléments flottants.

Plus globalement, tes pages sont affichées en mode Quirks car ton Doctype est «tronqué» (il n'y a pas d'URL de la DTD). Ton Doctype:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
Et le Doctype correct pour un affichage en mode Standard:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
	"http://www.w3.org/TR/html4/loose.dtd">


On lira:
http://css.alsacreations.com/Bases-et-indispensables/DTD-comment-choisir
http://css.alsacreations.com/Tutoriels-et-articles-divers/A-propos-du-Modele-de-boite-Microsoft-ou-quirks

Et aussi, à titre informatif:
http://blog.alsacreations.com/2007/04/07/344-demarche-integration-html-css
ok merci florent. j'avance j'avance ! lol
J'ai bienn mis le dtd maintenant mais du coup plus du tout de fond blancsous firefox alors que sur ie ué :s

J'ai du mettre le background color ou il fallait pas :s
djh3o a écrit :
J'ai du mettre le background color ou il fallait pas :s

Ou plutôt oublié d'en mettre Smiley cligne
Pourquoi ne pas dire à ton conteneur général (#wrap) d'afficher un bel arrière-plan ?
voila mon wrap :


#wrap {
background:#ffffff;
color:#404040;
margin:0;
margin-top:10;
width:1020px;
text-align: center ;
margin-left:auto;
margin-right:auto;
  height:100% ;
}


ça devrait etre blanc meme sur firefox nan ?
Modifié par djh3o (03 Mar 2008 - 15:48)
bon si je met background-color sur le wrap ça marche pas par contre si je le met dans le div marge gauche puis dans le div centre et dans le div marge droite ça marche mais par contre si on va sur la page des cgv (http://v2.promo-flyer.com/Lentreprise/CGV/tabid/79/language/fr-FR/Default.aspx) le blanc du centre etant plus grand celui des marges ne s'etire pas :s
P0l0 a écrit :
ça devrait etre blanc meme sur firefox nan ?

Non. Ni sur Firefox, ni sur Opera, ni sur Safari, ni sur Konqueror. Et ça n'est blanc avec Internet Explorer qu'à cause d'un comportement non standard de ce dernier (le HasLayout). J'ai donné un lien sur le dépassement des flottants, on pourra s'y référer. Smiley smile

Ah oui, et virer ce height:100% parasite (deuxième sommation Smiley lol ).

Globalement, ta feuille de styles présente un problème courant quand on débute: on tente plein de propriétés, on tâtonne, et au final on retrouve dans le CSS des tas de déchets (déclarations CSS inutiles voire amenant un effet non désiré sans qu'on s'en rende compte). Ça va s'améliorer avec le temps, mais en l'état c'est un peu brouillon. Smiley cligne