[CSS] Interface en 3 blocs de taille variable...

[Compte_supprime_2209]

Yop,

Je cherche depuis déjà un certain temps à faire une interface pour un site, en trois blocs (titre en haut, menu à gauche, contenu à droite), en utilisant CSS (2.1), et des layers, mais j'ai quelques problèmes pour conserver la possibilité de faire varier la taille des 3 blocs (utile si la taille de la police change, ou genre si je rajoute des liens dans le menu...)

En gros (j'ai viré les trucs inutiles, mais j'ai laissé les bordures, histoire de...), j'ai ça, pour l'instant:

Le bloc de titre:

div#header {
margin-bottom: 5px;
border-bottom: 1px dashed black;
}

Pour le menu:

div#menu {
float: left;
margin-right: 5px;
border: 1px dashed black;
border-left: 0px;
}

Et pour le bloc de contenu:

div#content {
border: 1px dashed black;
border-right: 0px;
}

(dans mon fichier index, les blocs sont crées dans cet ordre (titre, menu, contenu))

Avec ça, pour l'instant, le titre est parfait, le menu aussi... Le problème, c'est que le bloc de contenu passe derrière le menu (avec le "float: left;"), or, j'ai une bordure, et un fond pour le bloc du contenu, et je veux qu'il soit séparé de 5px du menu... (pas simplement le texte qu'il contient, le bloc complet...)

Je peux bien sûr regler les marges du bloc de contenu, pour qu'il ne soit plus recouvert par le menu, mais à ce moment là, il faut que je fixe la largeur du menu, et j'aimerai éviter, pour pas avoir de problèmes quand certaines personnes voudront agrandir la taille de la police du site...

Est-ce qu'il y aurait une autre méthode que le "float: left;" pour faire remonter le bloc de contenu (par défaut, il se met evidemment en-dessous du menu)? Ceci sans utiliser de positionnement absolu, ou de marges négatives, bien entendu, car si la taille des blocs changent, ça déformera tout... (Je suppose qu'il est possible d'ajuster les marges, et l'emplacement avec genre javascript, en direct, mais j'aimerai également éviter l'utilisation de Javascript :/)

Ce que j'ai actuellement:

 Titre
 --------------------------------------
 --------------------------------------
 |Menu   | Contenu
 |       | 
 |       | 
 |       | 
 |       | 
 |--------
 |
 | 
 --------------------------------------

Ce que je veux:

 Titre
 --------------------------------------
 -------- -----------------------------
 Menu   | | Contenu
        | |
        | |
        | |
        | |
 -------- |
          |
          |
          -----------------------------

(les tirets et barres verticales, c'est les bordures des blocs -ils sont collés aux bords de la fenêtre, donc théoriquement, pas de bordures du côté des bords de la fenêtre)

Si vous avez des idées, ou un nom de paramètre que j'aurai pas encore vu, n'hesitez pas ^_^

Merci d'avance.

[nonas]

J'aurai fait ça à la bourrin avec des tableaux mais si tu ne veux pas de positionnements absolus ça marche pas.

Et est-ce-qu'un "align=right" (ou un truc du genre) du bloc pourrait résoudre ton problème ? (J'suis pas vraiment spécialiste du CSS2)

[Compte_supprime_2209]

J'aurai fait ça à la bourrin avec des tableaux [...]

Trop lourd, vraiment, les tableaux

Et est-ce-qu'un "align=right" (ou un truc du genre) du bloc pourrait résoudre ton problème ? (J'suis pas vraiment spécialiste du CSS2)

Nope, rien de ce style pour contrôler la position des calques :/ Y'a tout un tas d'autres façons, mais tout ce que je connais suppose au moins une largeur fixe pour le menu ou le contenu :/

[Compte_supprime_2209]

Bon, sur #pcinpact on m'a indiqué de mettre un second "float: left;" pour le bloc de contenu cette fois; et j'obtiens ça:

Titre
--------------------------------------
-------- ----------
Menu   | | Contenu
       | |
       | |
       | |
       | |
-------- |
         |
         |
         ----------

A savoir que le bloc de contenu prend une largeur minimale (width en auto)... Si je règle sa largeur à 100%, le bloc déborde en dehors de la page, à droite (et repasse à la ligne, sous le menu, si la fenêtre est trop petite), parce qu'en CSS le 100% dans ce cas, signifie la largeur de la fenêtre, donc à cause du menu à gauche, ça fait deborder...

Est-ce que y'a un moyen d'avoir mon bloc de contenu aussi large que la page (moins la largeur du menu, et sans deborder de la page), toujours en essayant de n'utiliser que le CSS? :/

[Edit: Bon, après avoir un peu cherché sur Internet, j'ai lus un truc sur l'importance de garder des lignes courtes, donc je vais abandonner l'idée d'avoir mon bloc de contenu sur toute la fenêtre... Enfin si vous avez la solution au problème posé dans ce post, n'hesitez pas, j'aimerai bien comprendre comment on fait, ça peut toujours me resservir :)]