28221 sujets

CSS et mise en forme, CSS3

Mise en page Probleme avec footer

Salut

Ne trouvant aucune réponse sur d'autre forums je me tourne vers vous pour essayer de trouver une solution a mon problème. Smiley ravi .
|*************************************************|
Mon problème :
Le design devrait être comme ceci :
Design.
Tout se passe bien mais lorsque que j'arrive au footer celui-ci ne veux pas apparraitre ou ne se positionne pas bien.
Ma page
Css pour Firefox
Css pour Ie

Voila
Si vous avez besoin de précision n'hésitez pas, moi je continue a chercher mais rien a faire ... Smiley murf

Merci
Tiflo
Bonjour et bienvenue à toi sur ce forum,

Avant toute chose je te proposerais de bien assimiler les différents types de positionnement réalisables avec css, les articles d'Openweb sont disponibles ici ainsi qu'un tutoriel de Raphaël:
http://del.icio.us/Igor/cssp

Tu as une tendance (toute naturelle) à multiplier les divs et les class, il faudrait mieux se limiter à quelques grandes divs qui regroupent logiquement les différentes parties de ta page auxquelles tu appliqueras une id. À savoir un header, deux éléments de navigation, ton contenu principal et un footer. Je te conseille de revoir l'organisation de ta page en regard des lectures que je t'invite à lire:
http://www.alsacreations.com/articles/id_class
http://www.alsacreations.com/articles/economie
Merci

Je vais lire ces articles et revoir ma configuration alors ... Smiley langue
C'est ma 1er découpe, j'espère que sa ira plus vite les prochaines fois Smiley ravi .

Aller hop au boulots ...
Bon j'ai réussi mais il reste un dernier probleme :
Comment je peux faire pour que le fond de mon menu se répete jusqu'au bas de la page ?

Ma page
Mon css

Merci


Tiflo
Ben soit tu met une hauteur assez grande mais le probleme c'est que cette hauteur sera differente pour toutes les pages du site ou soit tu refais ton image de fond de menu, tu la fais en verticale pis tu l'as repete en x j'crois

voila..
Smiley dehors
Nan mais ton image de fond de menu -> celle-ci eh ben tu essayes de la refaire en vertical, elle se repetera en x grace à la largeur et tu met un repeat-y pour qu'elle se repete jusqu'en bas, quelle que soit la longueur de ta page!
Parce que j'ai pas besoin d'écrire par dessus.

Je comprend pas se que tu veux dire Smiley ravi Smiley ohwell .
Tu pourrais me montrer un exemple de code stp ?

Merci beaucoup Smiley ravi
D'après ce que je connais en css (et c'est limité), la solution que je connais (et j'ai pas dis que y'avait pas mieux), c'est de soit:

- prendre une image de ton menu de gauche et de la mettre d'une hauteur fixe et faire idem pour le contenu.

ou

- rajouter encore une image en dessous du menu de gauche qui aurait la dimension du vide à remplir et donner aussi une taille en hauteur de ton contenu.
Tiflo a écrit :
Malheuresement sa ne se repete pas.
Il s'agrandi en fonction du contenu.
Merci

Si tu lis l'anglais, cet article sur la technique des Faux columns est fait pour toi Smiley cligne
Le principe est de mettre une image en background qui se répète en hauteur et qui donne l'illusion que ta colonne la plus courte occupe tout l'espace que tu souhaites lui voir occuper.
Merci

Je comprend pas trop (Voir pas du tout). Smiley confus .
En plus leur Css et plutot bizar :
background: #ccc url(../images/bg_birch_800.gif) repeat-y 50% 0;


Smiley help

Merci pour ce lien ... Smiley bawling , l'anglais sa va d'habitude mais la big bleme Smiley ravi .
a écrit :
En plus leur Css et plutot bizar


Non non le css est normal Smiley lol

Entre parenthèse tu mets l'url de ton image, le repeat-y correspond à la répétition de l'image vers le bas...

Je pense que c'est la disposition du ccs qui t'intrigues : en une seule ligne. En fait de mettre le css ainsi permet de gagner de la place, au lieu d'avoir quelquechose du genre :

background :
color : #ccc ;
background-image : url(../images/bg_birch_800.gif) ;
background-repeat : background-repeat: repeat-x ;
...


Tu as ceci :
background: #ccc url(../images/bg_birch_800.gif) repeat-y 50% 0;


Voilà @+
Merci

J'avai pas compris le #ccc devant Smiley ravi .

Bon je pense avoir avancer d'un pas mais il reste du chemin ! Smiley ravi Smiley langue

@+
Sujet clos
Aller à