28220 sujets

CSS et mise en forme, CSS3

bonjour à tous!

j'ai lu plusieurs topics à propos de la hauteur et des colonnes factices mais ça ne correspond pas tout à fait à ce que je veux faire.

J'ai deux colonnes (une colonne menu et une colonne contenu) et en-dessous un footer qui prend toute la largeur de la page.

Avec mes attributs actuels, si la colonne contenu est plus longue que celle du menu, tout va bien.

Par contre si le contenu est très court (plus court que le menu), le footer s'aligne sous le contenu et le menu 'déborde'.

Le menu est de hauteur fixe (mais peut être alongé lors d'une prochaine mise à jour) et le contenu est de hauteur variable et appelé depuis un fichier séparé (appel php).

Pour voir l'état actuel des choses, jetez un oeil ici: http://www.elianora.xooit.net

Merci d'avance et désolée si j'ai mal les sujets déjà postés
Modifié par Elianora la blanche (02 Sep 2005 - 08:18)
connecté
Administrateur
Le site ne s'affiche pas chez moi (il charge indéfiniment).
Mais je suppose que tu déclares un "clear" dans ton footer. Donc si tu veux que ce clear fonctionne aussi avec le menu, il faut que ce menu soit flottant.

Bref :
- menu flottant
- contenu flottant
- footer avec clear both (par ex)

Et ça devrait marcher Smiley smile
bon ben je vais tester ça (le clear il y est déjà mais les deux colonnes ne sont pas en flottant)

et chez moi non plus mon site ne charge pas Smiley langue dsl

edit: bon j'ai mis mes colonnes en flottant, le footer est en clear:both mais ça ne résoud pas le pb

edit2: url de test provisoire: http://lilianafinn.free.fr/test
Modifié par Elianora la blanche (01 Sep 2005 - 16:36)
J'ai fait un test à partir de la page cette page

J'ai repris ton CSS, et en le modifiant légèrement ça fonctionne:
-dans #gauche, il faut supprimer le position:absolute;
-dans #centre, il faut mettre float:left;, et pas right
-toujours dans centre, supprime le margin-left:200px;
-encore dans centre, réduit un petit peu la largeur (genre 700px)

L'idée, c'est de "caler" tous les blocs vers la gauche dans ta page, et ensuite avec le "clear:both" le #pied va se mettre en dessous.

+
effectivement, comme ça c'est bon
sauf qu'il y a un tout petit souci au niveau de mon border: il ne vas pas jusqu'au footer si le contenu est plus court que le menu (logique puisqu'il est dans les attributs du contenu)
si je le mets dans les attributs du menu ça fera la même chose mais en sens inverse

comment je pourrais faire pour régler ce petit souci, svp?
merci!

edit: j'ai trouvé, j'ai mis une image de fond a ma div main et c'est tout bon

un enorme merci !!!
Modifié par Elianora la blanche (01 Sep 2005 - 18:08)