Reprise du message précédent :
Moi sur mon site de test divers et variés, http://plainsofpain.free.fr, j'ai fait un menu comme tu le veux en CSS ... C'est pas si dur, tu jouer avec les propriétés de fond de tes listes ul, lorsqu'elles sont dans l'id menu par exemple
 
ca donne un truc du style
 
Code html

 
Code CSS

 
En jouant avec les images, les tailles, et les couleurs, grâce aux CSS, on peut arriver a quelque chose de bien ...
 
Et aussi dans :
 
#menu
{
}
 
Tu rajoutes forcément les propriétés qui vont bien pour bien placer ton menu ...
 
Moi comme site avec des gabarits tout prêt pour comprendre comment cela fonctionne je te conseille http://www.alsacreations.com.
 
En espèrant que cela t'aide ... je débute également, mais avec tout ce que j'ai vu, je pense que le seul problème avec la mise en page full CSS c'est de se débrouiller pour que ca aille partout.  
 
C'est faisable cependant, mon site s'affiche correctement sous IE comme sous Firefox, en 800*600 comme en 1024*768 ou plus ...

 
Oups

 
C'est justement en lisant les tutoriaux de alsacreations que j'ai eu envie de bien faire tout mon site en css sans tableaux.
 
Au fait, en surfant sur ton site dans la rubrique "articles", j'ai remarqué un bug : le menu "liens" recouvre en partie le pied de page...

J'ai encore d'autres questions : pour la mise en page des formulaires, j'ai pas trouvé grand chose sur alsacreations. Je vais quand même pas mettre une <div> pour chaque <input>, <select> ou <textarea> de mon formulaire?
 
Sinon, comment on utilise l'attribut "accesskey" de <a>? Faut avoir un navigateur spécial? Parce que moi, ça marche pas quand j'appuie sur la touche du clavier correspondant à un lien...

C'est ce que je suis en train de faire les formulaires...
 
le formulaire est considéré comme un bloc il me semble, donc en définissant les styles pour form{}, form input{}, form select{}, etc dans la css ca doit le faire ...
 
Pour les accesskey je ne sais pas, je ne m'en sers pas.

Faut mettre un div dans le form, sinon ça passe pas :
 

 
Ensuite t'appliques les styles direct aux input, tu leur met des id, et hop, tu met en page direct.
 
D'ailleurs pour être valide niveau accessbilité, faut mettre des label :
 

 
En fait c'est tout bête, le pied de page se positionne en dessous du bloc central, et si le contenu du bloc central est court, le pied de page remonte !
 
Je comptais mettre une hauteur minimale du bloc central avec la propriété height-min:XXpx; mais je verrais ca plus tard, c'est pas ma priorité.
 

 
 
donc une balise <div> par input? Pas génial comme truc

Ben non, pas de balises div par input, une seule balise div pour tout le formulaire. Ensuite tu met ta liste de label et de input, que tu styles.

et en appliquant des styles directement à ma balise <form> via l'attribut "class", ça le ferait pas? De même, je peux positionner directement mes <input>, <select> et autres via ce même attribut?

Oui, tu peux positionner direct tes input. Les CSS en fait ne s'appliquent pas qu'a des div, mais à n'importe quelle balise
 

au fait, pour le coup du accesskey qui marche pas, qu'est-ce-que j'aurais oublié ou aurait raté? Merci

Ca dépend des browsers je pense... Genre sous FF j'ai pas le souvenir que ça marchait, en plus par défaut quand tu tapes sur une touche il te lance la recherche...

j'ai trouvé un site qui disait que accesskey était supprimé de <a> car ça faisait parti de la présentation, donc pas bien vu par xhtml 1.1... vrai ou faux?

bon alors, sur IE, le accesskey="1" (par ex) est à interpréter comme [alt]+1, ce qui va sélectionner le lien.
Sur Mozilla, faut faire [alt]+[shift]+1, ce qui va activer le lien (chargement de la page correspondante). Pas super l'accessibilité

Ah ok... Bon le [alt]+[shift] est pas pratique, en effet... Si seulement ils avaient implémenté ça différemment, genre tu tape la touche hop ça y va. Mais ils ont préféré leur supair recherche...

Heu dans Mozilla Alt+S marche très bien par exemple ici pour poster un message (accesskey="s" )
Le coup du Alt+Shift+1 c'est pas par hasard parce que vous avez des claviers azerty où les chiffres sont en shift+touche ?
 
Et le super système de recherche que tu sembles ne pas aimer, bah moi j'adore, je trouve ça vachement plus intéressant que des touches de raccourci (je surfe à la souris il y a juste après avoir tapé un texte que j'aime bien valider avec Enter ou Alt+S)

Arf, je pensais qu'il parlait de [alt]+[shift]+touche sur le pavé numérique, j'ai pas trop essayé en fait
 
PS : Longue vie au Qwerty

 
oui, je pense

par contre, j'ai pas trouvé pour Opéra...

allez hop, une autre question : je voudrais centrer verticalement un court texte (qui tient sur une ligne) dans une <div> qui a une image de fond dont j'ai spécifié la hauteur dans le css. J'ai bien trouvé qq chose sur alsacreations (le coup du vertical-align: middle; + display: table-cell, mais ça marche pas sous IE Est-ce-que je vais devoir utiliser les tableaux?

Dans ton cas y'a aucun moyens... Mais il ne faut pas se rabattre sur les tableaux, ce serait contraire à la règle
 
Donc je vais répondre de cette manière :
 
Rufo, il va falloir accepter ceci. Il n'est pas possible, à l'heure actuelle, de centrer verticalement quelquechose dont le conteneur n'a pas une height définie.

 
ben dans mon cas, si, la hauteur est définie.

Ah ben si la hauteur est définie, tu peux utiliser line-height, avec comme valeur la hauteur de ta div. Ou un positionnement absolu

 
le line-heigh, je connaissais pas. Merci.

En fait, si, je connaissais line-height. Mais je ne vois pas comment l'interlignage va m'aider à center mon texte verticalement

Ben réfléchis pas, ça marche, c'est tout D

haha elle est bien bonne
 
je bosse là dedans alors je peux un peu t'en parler : ok, les téléphones récents gèrent le xhtml, mais c'est chacun à sa façon et l'interprétation des CSS est ... cmmment dire ... assez aléatoire ...
 
en pratique, si tu veux faire un site XHTML correcte pour téléphone portable, tu peux déjà prévoir de gérer plusieurs versions de sites !    
 
Et le fait que ce soit du XML c'est juste plus propre, mais les téléphones sont assez puissant pour gérer un lagage de balise mal formé. regarde les téléphones i-mode qui intéreprète du cHTML ... Et la plupart des téléphones qui gère le XHTML le gère de façon non stricte : même si il n'est pas valide ils tentent de l'afficher. Dans la pratique, tu peux faire un site en HTML allégé et ca marchera dans la plupart des cas ...

 
tu peux me donner un ex de css pour centrer un texte dans une div d'une hauteur donnée? Merci.

 
Mon Motorola V500 gère parfaitement le type de media CSS "handheld", donc on peut gérer ça. Bon faut pas trop faire de fioritures, mais de toute façon avec 160 pixels de large, on fait pas grand chose    
 
Maintenant c'est sûr qu'ils acceptent des trucs pas valides, mais bon    
 
Sinon FireFox, quand la page XHTML est envoyée avec le bon type MIME, te dit les erreurs en cas de problèmes

 
sinon avec un position absolute, avec top 50%

 
et avec le line-height, ça donne quoi?

Si ton conteneur a genre une hauteur de 150px, tu met une line-height de 150px à ton texte (que tu inclura dans un p ou une span)

les motorola sont pas les pires pour l'interpretation du xhtmlp mp. je regarderai les bugs du v500 si tu veux
 
et que vient faire le type de media CSS là dedans    

 
Ben j'voulais dire que quand t'as genre une feuille de style avec media screen, et une avec media handeld, mon Moto prend bien la handheld, c'est plutot utile

ouais, mais t'es vachement optimiste à penser qu'une même page va pouvoir être utilisée pour un écran et pour un tel portable ... et je parle même pas du coût et du temps de téléchargement d'une page XHTML web dont les 9/10 ne seront pas affichés en media handset

 
C'est sûr, y'a un problème de poids. Mais au moins c'est possible    Surtout avec l'UMTS, y'aura super moyen. Enfin déjà avec le GPRS on a des débit type 56k...
 
Sinon regarde ma page d'accueil de mon serveur sur un PC et sur un mobile : http://lecastor.homeip.net/

ouais ...

 
titre qui prend 3 lignes, image qui se charge pas, scroll inutile pour voir le seul texte de la page... t'es recallé

Bon, y'a pas à dire, passer au xhtml+css sans tableaux, ça nécessite quand même vachement d'efforts! Comment on fiat pour qu'une <div> s'adapte à la taille de son contenu et qu'il ne prenne pas toute la largeur du conteneur parent? Je sens d'ici la réponse : c'est pas possible. Donc j'anticipe : comment on fait pour aligner horizontalement qq champs d'un formulaire dont on ne connait pas la taille en pixels et que la <div> s'adapte bien à la taille du contenu?

 
C'est justement l'effet désiré, j'affiche pas l'image parce que ça sert à rien, par contre y'a un texte à la place.
Mais sur mon Moto ça rend mieux, le texte est en couleurs
 
D'ailleurs ton mobile bug, il devrait pas afficher l'image  

 
Oui, y'a quelques limitations au CSS, mais faut pas oublier que c'est une technologie qui date d'il y a 5 ans (pour les CSS 2).
 
La version 3 corrigera un maximum de problèmes