Pourtant je regarde bien ou je mets les pieds...

Problèmes d'OS, de logiciel, de codage ? Venez poser ici vos questions !

Modérateur : Ze Techos

Répondre
Avatar de l’utilisateur
Adreqi
Pro de la Gimp-Attitude
Messages : 834
Inscription : lun. mai 02, 2005 12:25 pm
Contact :

Pourtant je regarde bien ou je mets les pieds...

Message par Adreqi » ven. mars 30, 2007 3:03 pm

voici mon petit problème :

sur le design orange que je vous ai présenté dans ma galerie, j'ai un magnifique Pied de Page. jusqu'ici tout va bien.
Problème : Quand il n'y a pas beaucoup de contenu, le pied est assez haut pour faire un effet des plus désagréables (il cache en partie la déco de la partie centrale)
Pour y remédier j'ai pensé à imposer une hauteur minimale (ici de 450px) de façon à ce que le pied ne soit jamais trop haut.

le problème encore est que j'ai ajouté pour ce faire une propriété css "height" a la partie centrale me disant que peut-être ce serait une hauteur minimale et extensible. or ce n'est pas le cas et j'ai découvert avec stupeur que mon Pied se balladait allègrement au milieu de mes tutos et autres trucs...

y'a-t-il une âme charitable pour me proposer une solution ?
(dans le cas contraire je supprimerai purement et simplement cette propriété "height. voila, na d'abord.)
Adreqi

Site Gimp-Attitude : Découvrez nos [url=http://www.gimp-attitude.org/ressources.php]ressources[/url] !

Avatar de l’utilisateur
Ayale
Chef de meute
Messages : 32
Inscription : lun. mars 19, 2007 4:05 pm
Localisation : Strasbourg
Contact :

Message par Ayale » ven. mars 30, 2007 3:21 pm

Je suis encore débutante en CSS, mais as-tu essayé d'inclure une propriété de positionnement pour ton pied de page (type: position, bottom ou z-index)?
blog : [url=http://www.ayale.bloxode.com/]ayale.bloxode.com[/url]
ubuntu, firefox, Gimp 2.2.13, tablette Wacom graphire4 XL

Avatar de l’utilisateur
Adreqi
Pro de la Gimp-Attitude
Messages : 834
Inscription : lun. mai 02, 2005 12:25 pm
Contact :

Message par Adreqi » ven. mars 30, 2007 3:55 pm

z-index est un indicateur de positionnement par rapport au fond de la page (comme des calques dans Gimp)

quand à position, je viens d'essayer, mais c'est par rapport au bas de la page non par rapport au contenu, du coup, ça se met dessus XD

mais je viens de trouver une solution qui fonctionne :
au lieu de mettre height au div qui est au-dessus j'ai mis "min-height"

par contre dans la doc ou je l'ai trouvé il n'est nulle part précisé que c'était compatible avec IE...
Adreqi

Site Gimp-Attitude : Découvrez nos [url=http://www.gimp-attitude.org/ressources.php]ressources[/url] !

Avatar de l’utilisateur
Ayale
Chef de meute
Messages : 32
Inscription : lun. mars 19, 2007 4:05 pm
Localisation : Strasbourg
Contact :

Message par Ayale » ven. mars 30, 2007 4:50 pm

ça à l'air de fonctionner sous IE 7.0.5730.11 (enfin, si tu l'as déjà installé :l0l: )
Comme quoi, je suis vraiment débutante ;)
blog : [url=http://www.ayale.bloxode.com/]ayale.bloxode.com[/url]
ubuntu, firefox, Gimp 2.2.13, tablette Wacom graphire4 XL

Avatar de l’utilisateur
Adreqi
Pro de la Gimp-Attitude
Messages : 834
Inscription : lun. mai 02, 2005 12:25 pm
Contact :

Message par Adreqi » ven. mars 30, 2007 4:58 pm

merci de la réponse :) non je l'ai pas installé vu que je suis a la fac sous fedora, et j'ai que firefox pour tester tout ça...

dès que je peux j'essaye sous IE6 parce que il est encore trop répandu pour être ignoré et c'est LUI qui pose problème :P
Adreqi

Site Gimp-Attitude : Découvrez nos [url=http://www.gimp-attitude.org/ressources.php]ressources[/url] !

Avatar de l’utilisateur
cuak
Maître pisteur
Messages : 1338
Inscription : ven. nov. 03, 2006 8:21 pm
Contact :

Message par cuak » ven. mars 30, 2007 5:10 pm

exactement

si tu veut envoie moi les fichier source enfin uploade les ici : http://cuak.free.fr et file moi le lien. Je corrigerai ton probleme.

PS: inclut un fichier texte expliquant bien stp.
[url=http://gatuto.free.fr][img]http://cuak.free.fr/logo/01.png[/img][/url]

Avatar de l’utilisateur
Flamme
Super mécano
Messages : 6624
Inscription : mar. avr. 20, 2004 11:33 pm
Localisation : Vincennes, France
Contact :

Message par Flamme » ven. mars 30, 2007 5:28 pm

J'ai dû avoir le même problème sur la vesrion précédente de GA, que j'ai résolu en introduisant dans une div supplémentaire tout ce qui ne devait pas interférer avec le pieds de page...
[b][color=indigo]Fondatrice / administratrice de GA[/color][/b]

Site Gimp Attitude : découvrez nos [url=http://www.gimp-attitude.org/ressources.php]ressources[/url] !

[b]Webmistress[/b] de :

[url=http://www.gimp-attitude.org][img]http://www.gimp-attitude.org/stock/02_ga.gif[/img][/url] [url=http://monde-des-forts.org/][img]http://www.gimp-attitude.org/stock/05_guerredesforts.gif[/img][/url] [url=http://monde-des-forts.org/missrachel/][img]http://lesamisdemissrachel.org/bans/miss-rachel.gif[/img][/url] [url=http://www.lignes-en-jeu.org][img]http://www.lignes-en-jeu.org/bans/lejmini.gif[/img][/url] [url=http://milathea.hautetfort.com/][img]http://milathea.hautetfort.com/media/02/01/a533d0d6f71f6420b6eed5dac6e771b1.gif[/img][/url]

Avatar de l’utilisateur
cuak
Maître pisteur
Messages : 1338
Inscription : ven. nov. 03, 2006 8:21 pm
Contact :

Message par cuak » ven. mars 30, 2007 5:35 pm

perso je pense que c'est un probleme de taille un oublie de specification de hauteur. Mais j'attend le fichier.
[url=http://gatuto.free.fr][img]http://cuak.free.fr/logo/01.png[/img][/url]

Avatar de l’utilisateur
Adreqi
Pro de la Gimp-Attitude
Messages : 834
Inscription : lun. mai 02, 2005 12:25 pm
Contact :

Message par Adreqi » sam. mars 31, 2007 12:31 pm

Ce ne sera pas nécessaire ça marche :) (sous firefox en tout cas)

je suis en train d'installer IEs4Linux pour avoir IE6 sur linux (et le 5 aussi) je verrai de cette façon si ça marche aussi sous IE6

les versions antérieures ne gérant de toutes façon pas correctement le css je ne m'attarderai pas dessus (je sais c'est mal XD)

Edit : les tests sont concluants, IE6 supporte min-height d'une manière très simple : il l'ignore superbement ! l'affichage qui en résulte n'est pas celui attendu avec firefox mais il en reste quand même correct.

quant à IE5, le css n'est pas vraiment sa tasse de thé mais le site reste malgré tout lisible, j'en suis heureux :)

merci pour vos aides-commentaires etc :)

flamme : j'envisageais l'ajout de div comme une solution ultime, car mon site étant multi-styles, il me fallait éviter la modification des pages html au maximum sous peine de devoir réécrire tous les css XD
Adreqi

Site Gimp-Attitude : Découvrez nos [url=http://www.gimp-attitude.org/ressources.php]ressources[/url] !

Avatar de l’utilisateur
piouPiouM
Pro de la Gimp-Attitude
Messages : 562
Inscription : lun. août 01, 2005 12:48 pm
Localisation : Lyon
Contact :

Message par piouPiouM » jeu. mai 17, 2007 6:57 pm

Pour commencer ajoute un conteneur global, par exemple #page :

Code : Tout sélectionner

<body>
    <div id="page">
        <div id="en_tete" />
        <div id="contenu" />
        <div id="piedpage">
    </div>
</body>
Ensuite applique les propriétées CSS suivantes :

Code : Tout sélectionner

html, body {
  height: 100%;
}

#page {
  position: relative;
  min-height: 100%;
}

#contenu {
  overflow: auto;
}

#piedpage {
  position: absolute;
  bottom: 0;
  left: 0;
}

/* Pour IE 6 et moins, qui gèrent mal min-height */
* html #page {
  height: 100%;
}
Il te suffira ensuite de gérer les largeurs des blocs ainsi que les histoires de marges internes et externes :)
[url=http://www.amazon.fr/dp/2744021733/]Découvrez le livre, Gimp : Apprenez, pratiquez, créez ! [color=darkgreen](2ème édition)[/color][/url]
[url=http://gimp4you.eu.org/]Gimp4you[/url], [url=http://gimp4you.eu.org/]tutoriels[/url] pour [url=http://gimp.org/]Gimp[/url] \(^o^)/

Avatar de l’utilisateur
Adreqi
Pro de la Gimp-Attitude
Messages : 834
Inscription : lun. mai 02, 2005 12:25 pm
Contact :

Message par Adreqi » ven. mai 18, 2007 1:07 pm

oula je suis pas trop sur mon site en ce moment mais je tenterai ça dès que j'aurai le temps et le courage de m'y atteler :) merci beaucoup ^^
Adreqi

Site Gimp-Attitude : Découvrez nos [url=http://www.gimp-attitude.org/ressources.php]ressources[/url] !

Répondre