pied de la page [probleme clear: both]

pied de la page [probleme clear: both] - HTML/CSS - Programmation

Marsh Posté le 25-07-2005 à 21:50:55    

voila meme apres avoir lusles tutos de alsa creations :d et d'autre site, je n'arrive pas a mettre en place le pied de ma page. :sweat: .
Car je voulai qu'il reste en bas que le #centre soit plus petit que le menus ou bien que le menus soit plus petit que le centre :d. vous pouvez voir la difference entre ces deux pages:
http://greeedisland.free.fr/accueil.php
et ou il n'apparait pas ( cacher derriere l'image :d ):
http://greeedisland.free.fr/scan.php


Message édité par kirua_sama le 02-08-2005 à 00:51:56
Reply

Marsh Posté le 25-07-2005 à 21:50:55   

Reply

Marsh Posté le 25-07-2005 à 23:24:45    

j'ai rien compris c'est normal?? :)

Reply

Marsh Posté le 26-07-2005 à 11:31:14    

euh excuse moi  : /
humm je ne sais pas comment t'expliquer... :( dans ce cas.

Reply

Marsh Posté le 26-07-2005 à 11:33:14    

les liens ne parlent pas d'eux memes?

Reply

Marsh Posté le 26-07-2005 à 11:41:06    

en fait selon la longueu de mon contenu le pied de la page ne s'affiche pas au meme endroit .

Reply

Marsh Posté le 26-07-2005 à 11:45:30    

Tu parles du "copyright" ?
Ben il m'apparait bien sur les deux pages en scrollant en bas de page !


---------------
La curiosité est un vilain défaut car l'erreur et la frustration sont de croire qu'elle pourra être satisfaite !
Reply

Marsh Posté le 26-07-2005 à 11:48:59    

:heink: ?? pas moi ... je teste sur modzilla et IE et toi ?

Reply

Marsh Posté le 26-07-2005 à 11:54:38    

IE


---------------
La curiosité est un vilain défaut car l'erreur et la frustration sont de croire qu'elle pourra être satisfaite !
Reply

Marsh Posté le 26-07-2005 à 11:56:42    

Qu'est ce que tu viens de changer ? Il n'apparait plus !


---------------
La curiosité est un vilain défaut car l'erreur et la frustration sont de croire qu'elle pourra être satisfaite !
Reply

Marsh Posté le 26-07-2005 à 12:00:52    

ah oui ok je vois... tu pourrais donner un bout de ton code pour voir? tu tourne en absolute ou en relative?

Reply

Marsh Posté le 26-07-2005 à 12:00:52   

Reply

Marsh Posté le 26-07-2005 à 12:06:42    

Citation :

<div id="centre">
 <img src="image_site/travaux.gif" style="position:relative; top: 100px;" />
 <div class="spacer"></div>
 <DIV id="pied"><p>Copyright © Greeed-Island 2005<br />All right reserved <a href="mailto:kirua_sama@hotmail.fr">Kirua-sama</a></p></DIV> </div>
 
 
  </DIV>
  </BODY>


 
aucun des deux j'ai mis aucun postionnement je voulais juste que ce soit comme un paragraphe. tout en bas

Reply

Marsh Posté le 26-07-2005 à 12:14:48    

Ouaou, tu devrait peu être les utiliser, sinon ça va tout faire planter, enfin je vois pas trop comment tu peu faire une mise en page avec des div di tu indique pas les positions à prendre... je sais pas si les autres seront de mon avis.. :)

Reply

Marsh Posté le 26-07-2005 à 12:14:51    

faut faire comment alors stp ? j'ai mis position relative top mais c'est pareil :(


Message édité par kirua_sama le 26-07-2005 à 12:16:37
Reply

Marsh Posté le 26-07-2005 à 12:15:47    

Bah regarde un peu jsutement du coté des mises en pages..  
allsacreation et selfhtml utilises généralement les positions non pour faire de la mise en page.. je me trompe?

Reply

Marsh Posté le 26-07-2005 à 12:16:37    

C'est quoi les attributs de #centre et #pied ds ta feuille de style?

Reply

Marsh Posté le 26-07-2005 à 12:17:32    

Citation :

#pied
   {
    position:relative; top: 20px;
   }
   


 
 
et  
 

Citation :

#centre
  {
   min-width: 350px;
   position: absolute;
   left: 250px;
   position: absolute;
   right: 145px;
   margin-right: auto;
   margin-left: auto;
   padding: auto;
   text-align: center;
  }

Reply

Marsh Posté le 26-07-2005 à 12:19:50    

Pourquoi il y à 2 position absolute dans le #centre??
 
C'est moi ou mélanger absolute et relative = très pas bonne mise en page :D

Reply

Marsh Posté le 26-07-2005 à 12:22:18    

Non, effectivement :D
 
Pour ton pied, tu lui attribues la largeur de ta page et tu le mets à la suite de ton div qui représente le corps de la page. Il ira automatiquement se coller en dessous. Ca pose juste un pb qd ton corps de page est très court, le pied de page remonte et ne colle pas au bas de l'écran. Mais ca, la soluce se trouve sur Alsacreations si ma mémoire est bonne.

Reply

Marsh Posté le 26-07-2005 à 12:22:35    

bah deux postion absolute, c'est pareil je vais corriger pour mettre:
position: absolute;
left: 250px; right: 145 px;

Reply

Marsh Posté le 26-07-2005 à 12:24:15    

voila c'etait exactement mon probleme justement.  
ou si je mettait pour mon corp:
min-height: 900px;
_height: 900px;
Ca marcherai bien non ?

Reply

Marsh Posté le 26-07-2005 à 12:25:21    

bah alors essai de mettre en texte en hidden dedant et plus de pb (lol le vieux bidouillage tout pourri :D )

Reply

Marsh Posté le 26-07-2005 à 12:27:03    

Mais vu ta mise en page, tu peux très bien ne pas passer par de l'absolu :p
 
Puis quand tu fermes un ul ds ton menu, commence par l'ouvrir, ca sera mieux, puis ca  te permet de lui donner des propriétés aussi !!
 
Faut que tu passes par un div d'entete : 100% de large, XXX px de haut.
 
Après tu crées un div en float left d'une largeur définie (%age ou nb de pixels) qui sera ta colonne de gauche. Ensuite un div #centre qui gèrera tout ton contenu. Tu le mets en 100% de hauteur et largeur définie comme celle du menu.
 
Ensuite, ton div pied de page : largeur 100%, hauteur comme tu veux, et 'cleat both' pour qu'il passe bien endessous des deux divs du dessus.

Reply

Marsh Posté le 26-07-2005 à 12:27:57    

En fait, tu retournes sur Alsa création et tu suis le tuto pour une mise en page à deux ou trois colonnes, tu repartirais sur de meilleures bases je crois ;)

Reply

Marsh Posté le 26-07-2005 à 12:29:00    

Onesque a écrit :


Ensuite, ton div pied de page : largeur 100%, hauteur comme tu veux, et 'cleat both' pour qu'il passe bien endessous des deux divs du dessus.


 
Tiens j'en connaissait une autre moi pour passer en dessous du reste..  Je me rappel plus c'est quoi, mais je sais qu'il existe autre chose..  :whistle:  :heink:

Reply

Marsh Posté le 26-07-2005 à 12:29:52    

Reply

Marsh Posté le 26-07-2005 à 12:39:55    

bah c'est exactement ce que j'ai fait il me semble :heink:

Citation :

<ul id="menus">
 
     <li><a href="accueil.php"><img src="mise_en_page/image/accueil.png" /></a></li>
      <li><img src="mise_en_page/menu/image/manga.png"></li>


 
en plus j'ai bien ouvert le ul :d :heink: ta des hallucinations :p

Reply

Marsh Posté le 26-07-2005 à 12:41:21    

Nanan, pas sur scan.php :p

Reply

Marsh Posté le 26-07-2005 à 12:42:38    

:o sisi:
<ul id="menus">
     <li><a href="accueil.php"><img src="mise_en_page/image/accueil.png" /></a></li>
      <li><img src="mise_en_page/menu/image/manga.png"></li>
      <li><a href="histoire_m.php">Histoire</a> </li>
      <li><a href="parution.php">Parution</a> </li>
 
et c'est partotu pareil car j'utilise include : menus.
 
 :kaola:  :o  :)

Reply

Marsh Posté le 26-07-2005 à 12:43:59    

ok, c'est bon, dsl, j'ai cru que tu ne l'avais pas mis à cause de l'affichage du source sous firefox. Ton "ul id=..." est à 4 km sur la droite, et j'ai pas scrollé pour aller le récupérer :D
 
Donc mea culpa ;)

Reply

Marsh Posté le 26-07-2005 à 12:44:45    

IL apparait sur la meme ligne que ton div bannière, mais super loin à droite.

Reply

Marsh Posté le 26-07-2005 à 14:13:03    

oue j'ai vu je n'ai aucune ideee de pourquoi il apparait la bas :d de toute facon c'est sans importance :) ;).
Sinon alors j'ai fait totu ce que le tutoriel d'alsa creation m'a dit me smble-t-il.
Pour moi la meilleur solution reste :
pour mon corp:
min-height: 900px;
_height: 900px;  
ce qui serai parfait non ?

Reply

Marsh Posté le 26-07-2005 à 14:20:02    

ben si ca marche, oui :D Je t'avoue que "min-height", jamais entendu parler pour le moment, alors je saurai pas te dire...
 
Mais si ca te met automatiquement le footer 900 px plus bas, c'est pas terrible pour les petites résolutions, non?

Reply

Marsh Posté le 26-07-2005 à 14:45:07    

Onesque a écrit :

ben si ca marche, oui :D Je t'avoue que "min-height", jamais entendu parler pour le moment, alors je saurai pas te dire...
 
Mais si ca te met automatiquement le footer 900 px plus bas, c'est pas terrible pour les petites résolutions, non?


 
J'ai utiliser une fois min-height, et ça à fonctionné correctement il me semble, donc je pense que ça peut être une solution.. A tester sur tes navagateurs, et ensuite essai de faire valider le code css, histoire de voir et d'optimiser au mieux ton code. :)

Reply

Marsh Posté le 26-07-2005 à 14:51:06    

bah en faite je ne vais pas mettre 900px plus bah mais a ( hauter banniere + hauteur menus +30 px ) plus bas ce qui fait que ce sera tout le temp au moin en dessous le menus ou plus bah ^^. ca marche normalement sous tous les navigateur pour IE on hack ^^.
C'etait juste pour faire valider cette solution comme si elle etait otpimise.

Reply

Marsh Posté le 26-07-2005 à 18:19:52    

en :d en faite ma methode ne marche pas :lol:  :sweat:  :hello:  :whistle:

Reply

Marsh Posté le 26-07-2005 à 18:32:14    

alors va jeter un coup d'oeil en haut et prend notre méthode :)

Reply

Marsh Posté le 26-07-2005 à 19:05:16    

mais j'ai deja fait comme sur alsacreation mais le pied remonte tout en haut, juste en dessous de la banniere.

Reply

Marsh Posté le 26-07-2005 à 21:03:52    

???

Reply

Marsh Posté le 27-07-2005 à 10:31:03    

Google, y'a des millions de pages qui traitent ce problème et donnent la soluce. Et si ma mémoire est bonne, Alsacréations aussi la donne...
 
ou là : http://pompage.net/pompe/pieds/

Reply

Marsh Posté le 28-07-2005 à 22:25:08    

salut plaisofpain j'ai utiliser ta methode mais elle en marche toujours pas ca me fait ccomme avant si mon contenu est plus grand que mon menus bah mon pied reste quand meme jsute en dessous du menus, tien regarde un lien pour verifier ems dires ^^:
http://greeedisland.free.fr/livreor.php

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed