| |
|
Voir le sujet précédent :: Voir le sujet suivant
|
| Auteur |
Message |
| |
|
finstreet
WRInaute accro
Inscrit le: 10 Juil 2005
Messages: 9400
|
 Posté le : Ven Mar 28, 2008 22:29 Sujet du message: Pb de footer sur div |
|
|
Bonjour 
Bon alors j'ai décidé pour mon nouveau site de tout développer en valide xhtml 1.0 ... on rigole pas mais sur la page d'accueil avec trois liens, suis arrivé à faire 50 fautes lol pas facile de passer des tables au css
Bref, c'est pour vous dire que je suis une grosse bille en div et autres css
Alors voila mon soucis :
Il s'agit bien évidemment des couleurs définitives
 Alors en rouge, ca s'appelle le MENU... waaa trop fort
Voici le code :
| Code: |
| div#menu {position:relative;width:1024px;height:150px;top:0px;left:0px;background-color:#EEEEEE;padding-top:2px;text-align:center;} |
En vert foncé, c'est le CORPS
| Code: |
| div#corps {position:relative;width:1024px;top:0px;left:0px;} |
Il contient le CONTENU (vert clair), les DETAILS (le bleu) et les LIENS (orange)
| Code: |
div#contenu {position:absolute; width:542px;background-color:white;left:0px;padding:4px;margin:4px;border-style:dotted;border-width:thin;}
div#detail {position:absolute; width:300px;background-color:yellow;left:558px;background-color:white;padding:4px;min-height:100%;}
div#liens {position:absolute; width:150px;background-color:#EEEEEE;left:866px;padding:4px;text-align:right;} |
En bas c'est le violet et c'est ca le problème
Il manque aussi le global à vous montrer :
| Citation: |
| #global {position:relative;margin-left: auto;margin-right: auto;width: 1024px;text-align: left; /* on rétablit l'alignement normal du texte */} |
Il englobe tout et permet de centrer le site
Voici la structure de la page :
| Code: |
<div id="global">
<div id="menu"></div>
<div id="corps">
<div id="contenu"></div>
<div id="detail"></div>
<div id="liens"></div>
</div>
</div> |
J'ai deux problèmes.
1. Je souhaite pouvoir afficher une couleur uniforme sur toute la hauteur de la rubrique LIENS (en orange). Au mieux j'arrive à faire 100% de l'écran et encore si y'a pas trop de texte parce que là ca descend pas jusqu'en bas
2. dans le meme temps, je souhaiterais mettre un footer (le truc violet). J'arrive à définir la hauteur... mais quand le texte du CONTENU est trop long, le FOOTER coupe le CONTENU. J'ai pas pu faire mieux. La plupart de mes tests se sont terminés en footer collé en haut
Donc voici les deux problèmes. Je peux répondre à toutes vos questions (en fait pour Lady Di c'est un complot) si vous voulez des infos complémentaires
J'espère avoir été clair
Ciao ciao |
|
| |
|
 |
dayassine
WRInaute impliqué
Inscrit le: 03 Juin 2007
Messages: 307
Localisation: Var
|
|
| |
|
|
Lomax7
WRInaute impliqué
Inscrit le: 29 Mar 2007
Messages: 324
Localisation: Toulouse
|
| Posté le : Ven Mar 28, 2008 23:01 Sujet du message: Pb de footer sur div |
|
|
J'ai pas tout compris pour ton premier problème. Sois plus clair. 
Par contre pour le footer je te conseil de bannir position absolute des pages
ou tu veux que le footer colle au corps sans le chevaucher.
La position absolute c'est parfait pour une mise en page tres stricte.
Moi je l'utilise très peu, j'utilise exclusivement la position relative.
Sinon tu peux utiliser les float, mais ça ne te permet pas une grande marge
de manoeuvre en ce qui concerne le positionnement des div. |
|
| |
|
|
finstreet
WRInaute accro
Inscrit le: 10 Juil 2005
Messages: 9400
|
| Posté le : Sam Mar 29, 2008 1:50 Sujet du message: Pb de footer sur div |
|
|
Merci
C'est en parti réglé... en parti seulement car la solution peut être un peu merdouilleuse
Donc j'ai choisi ce modèle ci : http://css.alsacreations.com/modeles/modele5.htm
Mais deux soucis :
- la colonne de droite n'a pas de fond de couleur spécifique... ca s'arrete dès que le texte s'arrete. La bidouille utilisée est trop bidouilleuse meme pour moi
- deuxio, cela implique que la colonne de droite et de gauche soient toujours moins hautes que la colonne du milieu... et ca par nature on ne sait pas
Mais bon j'ai déjà un bon gabarit que j'essaierais d'améliorer
Merci |
|
| |
|
|
tonguide
WRInaute passionné
Inscrit le: 28 Nov 2003
Messages: 963
|
| Posté le : Sam Mar 29, 2008 2:53 Sujet du message: Pb de footer sur div |
|
|
Si c'est uniforme du haut en bas les couleurs, tu te fatigues pas. Tu fais comme tu as fais pour le moment (au niveau des div).
Et au lieu de mettre le code couleur pour chaque bloc, tu mets une image qui va contenir une ligne des 3 blocs, du genre 1px de hauteur et XXXpx de largeur (taille de ton design). Cette image tu l'as mets en fond du bloc qui contient les 3 autres.
Comme ça, peu importe quel bloc est le plus bas, les 3 blocs seront alignés en bas.
Pour ton footer ... après les 3 blocs, dans le div principal (pas obligé de le sortir, sauf si vraiment tu aimes ça, ou si tu as une couleur dedans), essai de mettre <div style="clear:both;"></div> juste avant le code de ton div du footer.
Bon courage
(oublie pas de t'amuser à regarder sur IE 6 ) |
|
| |
|
|
finstreet
WRInaute accro
Inscrit le: 10 Juil 2005
Messages: 9400
|
| Posté le : Sam Mar 29, 2008 9:40 Sujet du message: Pb de footer sur div |
|
|
Ah y'a du mieux
Alors pour le truc de l'image, ca marche parfaitement.... un tit background repeat et c bon
par contre le footer se retrouve parfois dans ls choux... je recollerais le code ce week end
rhooo déjà j'essaye sur Mozilla... IE 6 on verra lol |
|
| |
|
|
| |
|
|
|
|
Autres sujets de discussion :
|
|
