Tout est dans le titre. Je cherche à coder à la norme et j'ai du mal . Comment coderiez-vous la chose suivante :
 
1 tableau d'une ligne et 3 colonnes
 
A coder qu'avec des <div> (il y en a donc 4 : 1 pour le tableau et 3 pour chaque colonne)...
 
EDIT : et pas de coordonnées absolue pour le positionnement ! ... mais relatives

C'est pour quoi faire ?
 
Si c'est pour des données tabulaires, un tableau c'est bien.
 
Sinon si c'est pour du architecture de ton site, on nomme pas ça tableau
 
Pour 3 colonne  facile : 3 div, ou tu applique une taille + float left...
 
Voilà

 
 
ça marche pas sous ie6 ! seulement sous firefox !
 
j'ai fais ce qu'ils disent sur ce site : http://www.webpronews.com/webdevel [...] hDivs.html

voila la css de mes 2 colonnes :
 
#colonne 1  
 
.tree {
 position: relative;
 height: 100%;
 width: 30%;
 background-color: #339966;
 float:left;
}
 
#colonne 2
.supervision {
 position: relative;
 height: 100%;
 width: 70%;
 background-color: #66CCCC;
 margin-left: 30%;
}

et encore 2 colonnes d'imbriquées dans la colonne 2 :
 
# colonne 1
.synoptic {
 position: relative;
 height: 100%;
 width: 50%;
 background-color: #33CC66;
 float: left;
}
 
# colonne 2
.mapArea {
 position: relative;
 height: 100%;
 width: 50%;
 background-color: #9999CC;
 margin-left: 50%;
}

j'ai encore essaié ça : http://www.quirksmode.org/dom/3column.html
 
Mais sous IE ca veut pas marcher ! J'ai bien mes 2 colonnes mais sur 2 lignes au lieu d'une seule .

Voilà la page html :
 
http://membres.lycos.fr/unsitebidon/maquette2.html
 
et la css
[url]
http://membres.lycos.fr/unsitebidon/maquette2.css[/url]

Bon ce n'était pas bien sorcier ce que je demandais   . J'ai fini par trouver.
 
La réponse est simple : div pour faire des lignes (remplace <tr> ) et span pour faire des colonnes (remplace <td> )....à croire qu'il n'y a aucun web-designer ici  

n'importe-quoi.

Quand on a besoin de faire des tableaux, on utilise des tableaux Faut pas s'amuser à tout remplacer n'importe comment. Une div représente une section, un groupe d'éléments. Un span est là pour marquer un élément particulié dans un texte par exemple.

mouhaha  

Les réflexions de ce genre ne sont pas vraiment appréciés sur hFr.
 
Mais bon comme c'est noel : www.alsacreations.com > tutoriels > css > un site en deux colonnes avec <div>

Ces Notions sont assez abstraites qq'un peut-il me dire ce qui ne va pas ici ? Regardez les différences entre IE et Firefox .. Blasant
(Afin de linéariser le site) http://www.portail-patrimoine.com/z1.php

Up, je crois pas que "alsacreations" ne réponde au problème j'ai perdu 1/2 heure à regarder les forums .. où tout le monde se croit plus fort, sans trouver aucune solution, si juste en trouvant que si on met des fruits sur un site c'est cool c'est design et que tout le monde aura ton approbation ..
 
En gros on m'a dit : ton truc c'est pas possible, on efface ton post ..

Alsacréation est un site qui qui prône le codage des sites aux normes W3C et ils répondent aux trucs sensé.
Ton code donne envie de vomir, codage en tableau, feuille de style, mais rajout de style un peu partout, personne n'a envie de se plonger dans un tel code...
En gros refait tout en te basant sur des mises en pages claires et respectant les standards et tout rentrera dans l'ordre et tu trouvera de l'aide ici et chez Alsa.

Ok je ne considère cela comme une réponse de mauvaise fois, je respecte les normes W3C
des grandes gueules en sorte, merci ça n'a servi à rien, tu réponds à rien, tu "prones"

certes je prône pour les normes    
 
Mais, qui a des problèmes avec son site codé à l'ancienne ne respectant aucun standards ?  
Ton site est inexploitable sous IE et le menu est illisible sous Firefox !
 
Ne te demande tu pas pourquoi personne ne t'as aidé ici ou chez Alsa ?  
Tu refuse de te remettre en cause, ben bon courage...

Car il s'agit d'une page de test sur cette mise en forme en span avec les floats, qui ne fonctionne ni sous IE, ni FireFox,
Que le but de mon post est de demander pourquoi, car j'ai suivi à la lettre les tutos Alsa.

Fort de cette observation, ces trucs ne marchent que dans leur monde, pas ailleurs  

+30.000   à moins que qq'un ici puisse prouver "Voici comment ça marche, voici ce que tu devrais faire"

Désolé de te contredire si tu avais suivit à la lettre les tutos d'Alsa ça fonctionnerait, je les ai personnellement essayé sans soucis.
 
mort de rire en ce qui concerne la citation de FlorentG il ne s'agissait pas ici de mise en page mais de données tabulaires qui bien évidement doivent être présentées dans un tableau !

grosbin, les notions d'accessibilité et de sémantique, ça te dit qq chose?
-> l'accessibilité : il faut que ton site soit accessible aux personnes handicapées. Ca implique que ton code html ne contienne que la structure du document et l'info qu'il contient (le texte + images). Rien sur la mise en page (ça, c'est le boulot du css)
-> la sémantique : ça, c'est plus pour la bonne indexation de tes pages web par les moteurs de recherche. En gros, tu utilises les balises pour leur caractère sémantique (ce qu'elles signifient) et non pour leur façon d'être affichée par le navigateur.
Ex: pour insister un peu sur une portion de texte important, on peut utiliser <em> et non <i>. Pour insister encore plus, on va utiliser <strong> et non <b>.
De même, si tu utilises dans ton texte un acronyme et qu'il faut en donner la signification, tu vas utiliser <acronyme title="FireFox">FF</acronym>.
 
Donc, ça exclut d'utiliser les <table> pour de la mise en page. Et puis si tu dois changer un jour la charge graphique du site, t'auras l'air malin ! faudra tout recoder les pages html au lieu d'avoir juste à modifier le css. Ca exclut aussi de proposer plusieurs mises en page pour l'utilisateur ...
 
Donc, si on prône si haut et fort les normes, c'est qu'il y a un réel intérêt.
 
ps : une astuce pour savoir si ton site est bien construit d'un point de vue sémantique : dans FF, fait afficher ton site avec le mode d'affichage "sans style". Si ton site est encore exploitable et qu'on repère bien toutes les différentes parties de celui-ci (les titres de différents niveaux, les menus...), alors c'est qu'il est bien construit a priori. C'est pas suffisant, mais c'est un bon début

"grosbin, les notions d'accessibilité et de sémantique, ça te dit qq chose? "
 
Sur le fond je suis d'accord avec toi en plus sur le long terme on gagne beaucoup de temps après il ne faut pas non plus devenir intégriste, il ya plein de cas ou le developement ne s'adresse qu'a une population limitée pour laquelle les notions d'accessibilité n'ont aucun intérêt.

IWH  

 
Pour info, y'a une loi européenne qui impose que tous les sites web de l'administration d'un pays soient accessibles aux personnes handicapées. En suivant les normes du W3C, ça coûte pas plus cher de rendre son site accessible au minimum en classe A voir AA (le max étant AAA). Donc pourquoi s'en priver? En +, bien souvent, on se retrouve avec un code html plus léger => gain en bande passante => ça s'affiche plus vite (à moins que t'aies chargé comme une mule le css d'images bien grosses) => l'utilisateur attend moins.  
Moi, j'y vois que des avantages pour si peu d'inconvénients (y'a encore qq trucs qu'on pouvait faire facilement avec les tableaux qu'on peu pas faire avec le css 2.1).

Sauf que la plupart des mecs qui se proposent de faire des sites comme ça, sont des branques et n'y connaissent queudal et au final on se retrouve avec une merde pire qu'avant

La dernière fois que j'en ai entendu parler, c'était pendant mes études, un groupe avait vanté les avantages du XHTML 1.0 Css valide en div toussa .. Ca leur a pris 3 mois pour faire 6 pages, ils avaient récolté la pire note des projets ..
Ne pas omettre qu'aucun avait validé son année par la suite, bref gatsu+1, les intégristes sont ceux qui ont le moins d'expérince  
 

Respecter la norme ne garantit pas qu'un site soit bien (tant du point de vue du contenu que de l'ergonomie). C'est un cadre qui va par contre garantir un certain nb de choses.
ex : si tu respectes la norme, ton site va s'afficher de la même manière dans tous les navigateurs.
Dans la pratique, cette affirmation est fausse parce que justement, certains navigateurs ne respectent pas la norme! Ca oblige donc les développeurs à se prendre le choux alors que ça pourrait être si simple...
Je pense qu'on a tous connu l'époque où pour faire du "dhtml", fallait détecter le navigateur pui utiliser la balise <div> ou <layer>. Du reste, encore beaucoup de JS commencent par détecter le navigateur pour adapter une portion du code. Ca fait du boulot en +

Mais c'est quoi cette mode actuelle qui consiste à faire remonter des topics qui ont entre 6 mois et 3 ans pour s'y incrusté?
 
grosbin > Je n'ai pas de différence sur ta page. Dans les deux cas cça m'affiche :

 
PS : Je sais, c'est la rentré, mais quand même ...

Oops cela s'appelle l'écart et un fichier de tests oublié sur le site ..
Branche de développement ..

Comme indiqué sur alsacréation, si le doctype n'indique pas de DTD, IE utilise son modèle de boite à lui (et non pas le modèle standard)
Pour qu'IE réagisse comme il faut, il te suffit de remplacer ton doctype par :

 
PS : Rajout du lien vers le document d'alsacréation.

Ah l'ajout de loose m'a détruit les attributs "padding: 0 20 0 20 px"

Et oui, c'est ça la différence entre le modèle standard et le modèle IE :
le padding est à l'intérieur dans le modèle standard et à l'extérieur dans le modèle IE. Si tu veux une marge extérieure à la boite, utilise donc le "margin" qui est fait pour ça.

Subtil, donc la déclaration "loose" inverse mes effets de padding et margin, ainsi j'ai tout fait à l'envers depuis mes départs

C'est ce qui s'appelle être un looser.
Je rigole.

t'es plutot mauvais là et aux dernieres nouvelles on mets des unités donc : padding: 0 20px 0 20px (qui s'ecrit aussi : 0 20px)

Yep merci

Mouais c'est pas terrible quand même là. Tu comptes en faire un site commercial ou c'est juste perso?

Très loin d'être fini celui là ..
  Si vous avez des critiques, elles sont les bienvenues

Bah donne déjà l'orientation de ton site.