Adapter un modèle

[NorSeb]

Bonjour,

Je suis en train de faire un site et j'essaie de me mettre au CSS. Jusqu'a présent j'utilisais des <table>...

Bref... je m'y mets doucement. Pour ce faire je suis allé lire les articles du Hub et d'Alsacreations, notamment le modèle suivant : http://css.alsacreations.com/modeles/modele3.htm

Ma question est simple : comment faire en sorte que, si le contenu du menu de gauche contient plus de lignes que la partie centrale, il ne chevauche pas brutalement le pied de page ? (et que le tout se redimensionne proprement).

Merci

[NorSeb]

Ma question est simple : comment faire en sorte que, si le contenu du menu de gauche contient plus de lignes que la partie centrale, il ne chevauche pas brutalement le pied de page ? (et que le tout se redimensionne proprement).

Pour "pousser" un peu plus loin, je voudrais faire en sorte que ces deux colonnes (appelons-les "menu" et "contenu") aient exactement la même taille, quelque soit le contenu de l'une ou de l'autre...

[KaRaK]

Je ne sais pas si j'ia bien compris mais pour qu'il n'y est pas de chevauchement il faut que ton footer soit dans une troisieme div et pas dans la meme div que ta partie centrale.

Tu peux utiliser la proprieté clear:both pour ton footer, il n'y aura rien ni à droite, ni à

gauche et donc pas de chevauchement. (en principe )

[Dudu]

Salut NorSeb

Pour qu'un "contenu" et un "menu" (bref, 2 colonnes côte à côte) aient la même taille, c'est à la fois très simple, mais très pointilleux.

Par exemple, un "height:100%" sur chacun marche très bien.... à la condition que la taille de l'élément parent (souvent il s'agit du body) ait été spécifiée.

Ben oui, sinon le navigateur calcule 100% de quoi ?

Quant au pied de page, c'est typiquement le style de conteneur à qui il faut appliquer un "clear:both" pour éviter un chevauchement. La règle clear force le passage à la ligne en annulant un éventuel float.

Bon courage, et bienvenue dans le monde magique des CSS

PS: halte à la "divite", un footer, selon ce qu'il contient comme infos, peut très bien trouver sa place dans une balise <address> par exemple

[MarvinLeRouge]

Salut,

Si tu as seulement besoin qu'on ait l'impression visuelle que le "menu" et le "contenu" aient la même hauteur, tu peux peut-être utiliser la méthodes des "fausses colonnes" de Dan Cederholm. Tu en trouveras une traduction sur Pompage.

[NorSeb]

Bonjour,

Merci beaucoup pour vos réponses... Je vais pouvoir avancer

Pour qu'un "contenu" et un "menu" (bref, 2 colonnes côte à côte) aient la même taille, c'est à la fois très simple, mais très pointilleux.

Et bé ! Ca commence bien

Par exemple, un "height:100%" sur chacun marche très bien.... à la condition que la taille de l'élément parent (souvent il s'agit du body) ait été spécifiée.

Ben oui, sinon le navigateur calcule 100% de quoi ?

Quant au pied de page, c'est typiquement le style de conteneur à qui il faut appliquer un "clear:both" pour éviter un chevauchement. La règle clear force le passage à la ligne en annulant un éventuel float.

Je vais essayer ca tout de suite...

Bon courage, et bienvenue dans le monde magique des CSS

Pour l'instant c'est plutôt : mais qu'est-ce que je viens faire dans cette galère.

C'est un peu comme la première fois qu'on conduit à gauche tu vois ? Tu sais conduire mais il faut quand même tout réapprendre.

Salut,

Si tu as seulement besoin qu'on ait l'impression visuelle que le "menu" et le "contenu" aient la même hauteur, tu peux peut-être utiliser la méthodes des "fausses colonnes" de Dan Cederholm. Tu en trouveras une traduction sur Pompage.

<{POST_SNAPBACK}>

Je vais regarder ca mais malheureusement (pour moi) il ne s'agit pas que d'une impression visuelle mais une taille concrète.

Merci encore

[Nullette]

Pour l'instant c'est plutôt : mais qu'est-ce que je viens faire dans cette galère.

Comme je te comprends NorSeb

Tu verras, tu y arriveras, en t'inspirant de modèles, en lisant et relisant les excellents sites cités plus haut, en faisant des tests.

Bon courage

[Raphael]

Pour "pousser" un peu plus loin, je voudrais faire en sorte que ces deux colonnes (appelons-les "menu" et "contenu") aient exactement la même taille, quelque soit le contenu de l'une ou de l'autre...

<{POST_SNAPBACK}>

Hello,

Tu cherches quelquechose dans ce genre ?

http://forum.alsacreations.com/faq/#item17

[NorSeb]

Merci Sibelius

Ca va me faire encore un peu plus de lecture... c'est bien.

Je suis en train de regarder quelques codes sources Ca instruit.

[NorSeb]

Je suis en train de regarder quelques codes sources Ca instruit.

<{POST_SNAPBACK}>

Oui et ca embrouille aussi Je touche au but mais à chaque fois que je modifie une chose, ca me fout le bazar en cascade...

Prenons un cas concret : http://pompage.net/pompe/cssdezero-13/

Pouvez-vous m'expliquer comment, sur cette page, les bloc "Fiche technique" et "A propos de l'auteur" sont alignés l'un en dessous de l'autre ??

Merci.

[ryuran]

ça parait simple comme réponse:

Ce sont 2 blocs consecutifs dans le flux html donc l'un apres l'autre et comme ce sont des <div>, éléments de type bloc ils se mettent l'un en dessous de l'autre