Discussion :

[abc.xyz]

Bonjour,

lorsqu'on a une maquette à intégrer et que sur cette page il y a 3 parties:

-un bandeau en haut
-un milieu de page
-un pieds de page

Je signale que sur la maquette le pieds de page est bien en bas de la page, il n'y a rien en dessous.

Je travaille sur ordi portable et je me pose la question:

si je commence mon intégration en mesurant la height de ces 3 parties avec l outil règle de photoshop et que je reporte dans mon css cette height en pixels pour chacun des éléments et que je teste mon site sur mon ordi portable et que le pieds de page se trouve bien en bas de la page dans mon navigateur lors du test en local, et bien lorsque je vais changer de média et que je vais tester mon site sur large desktop et bien il y a des chances que mon pieds de page ne soit pas en bas de l'écran il sera plus haut et ça car l'écran des large desktops est plus grand et que j'ai codé la height de mes trois parties en pixels

Donc comment faire pour intégrer cette page et que le pieds de page soit bien en bas de la page lors du test sur tous les supports?

PS: la solution n'est je pense pas de coder la height des éléments en pourcentage car c'est déconseillé

Merci

[kevin254kl]

Bonjour, vue le nombre de support possible c'est un problème courent en effet il faut parfois agencer les éléments diféremment, regarder du côté du responsive design http://objetdirect.developpez.com/tu...onsive-design/ cordialement.

[abc.xyz]

merci de ta réponse mais je pense qu'il s'agit d'une question basique ce raisonnement sur le respect sur tous les supports de la height des éléments , je n'ai pas le temps de lire l'article sur le responsive design, j'aimerai bien que l'on m aide en m'expliquant par un ex simple.

Merci

[Invité]

Bonjour,

..., je n'ai pas le temps de lire l'article sur le responsive design, ...

Donc, tu estimes que NOUS avons du temps à perdre à t'expliquer...

On peut supposer que tu n'as pas non plus le temps de faire une recherche... "footer en bas de page"

[abc.xyz]

je n'ai pas dit ça du tout..j'ai déjà fait la recherche google dont tu parles, j'ai même trouvé un lien sur la FAQ de developpez sur les footer en bas de page mais je pense qu'on doit se passer du positionnement absolu pour résoudre ce problème.

C'est un raisonnement vraiment basique et simple d'intégrateur de respecter les height sur tous les supports mais je ne le connais pas bien

Et si je poste c'est que j'ai déjà passé plus de 24h à chercher partout sur Google et je n'ai rien trouvé de clair sur le sujet

Merci encore

[abc.xyz]

Je ne comprends pas bien, je viens de lire sur le web que pour un site adaptatif il faut mentionner les hauteurs de blocs en %, effectivement ça se comprend par rappport à mon post, cependant je ne pense pas du tout mais alors du tout que c'est la solution car j'ai lu ailleurs que c'etait même déconseillé...

Sur ce lien http://css-tricks.com/forums/topic/r...design-height/ on explique que la height, comme je le savais, est définie par ce qu ily a à l'intérieur, elle est donc dynamique, cependant mon problème demeure..

Donc j'ai toujours la même interrogation, lorsqu'on a une maquette avec un footer en bas de page, comment coder CSS pur que ce footer soit en bas de page sur tous les supports

[Muchos]

Votre réflexion semble polluée d'idées reçues

je viens de lire sur le web que pour un site adaptatif il faut mentionner les hauteurs de blocs en %, effectivement ça se comprend par rappport à mon post, cependant je ne pense pas du tout mais alors du tout que c'est la solution car j'ai lu ailleurs que c'etait même déconseillé...

Vérifiez bien ce que vous lisez et où vous le lisez
En attendant, comme vous le constatez avec votre problème, des tailles relatives (en % par ex.) sont forcément plus souples que des tailles absolues (en PX par ex.)

on explique que la height, comme je le savais, est définie par ce qu ily a à l'intérieur, elle est donc dynamique

Pas forcément: si vous fixez une taille à votre HEIGHT, peu importe ce qu'elle contient…

comment coder CSS pur que ce footer soit en bas de page sur tous les supports

Comme le dit jreaux62, une simple recherche vous mène à la solution. Ici, le positionnement absolu.

[abc.xyz]

j'entends bien votre réponse sur le positionnement absolu,merci, mais que faites vous du bloc juste au dessus :le milieu de page?

Je me permets de vous dire après réflexion que je ne pense pas que le positionnement absolu soit la bonne méthode , en effet si vous positionnez le footer en absolu vous reportez le problème que je soulève sur l'élement juste au dessus du footer (le milieu de page) : il y a beaucoup de chance en mettant le footer en absolu que le milieu de page ne vienne pas "coller" au pieds de page pour la simple et bonne raison qu'un élément en absolu ne fait plus partie du flux de la page.

Je pencherai plutôt pour la solution des height en %, sans en être sur du tout, mais alors du tout.

Cette nouvelle petite question élargit le problème que je pose qui ne s'arrête pas au pieds de page mais qui concerne la méthode vis à vis des hauteurs des différents éléments que l'on doit avoir lorsqu'on intègre une maquette.

Merci

[NoSmoking]

Bonjour,
et dans tes nombreuses recherches (?) tu n'es pas tombé sur cette discussion Page "pleine" sur les navigateurs et la solution que je propose au post #5 ?

PS: il y en a bien d'autres dans ce forum d'ailleurs.

[abc.xyz]

NoSmoking, merci de ton aide de prendre sur ton temps pour m'aider c'est tres sympa, seulement je dois réagir lorsque je ne suis pas d'accord avec les solutions que l'on me propose et là NoSmoking je ne suis pas d'accord ton post#5 n'est pas faux mais il ne coorespond pas à la solution de mon problème.

Je pense en fait que la solution est de mettre des height aux différentes parties en %, quelqu'un de calé en intégration pourrait t'il me le confirmer?Car je n'en suis pas sur du tout

je sais je me répète mais je pense que c'est nécessaire de résumer pour cerner exactement le problème soulevé:

ma question n'est pas relative uniquement au footer mais à la méthode at au raisonnement que l'on doit avoir lorsqu'on integre une maquette pour que la page entière soit remplie de haut en bas sur tous les supports par les differentes parties de cette page.
Quelle est cette méthode?
car si on indique les éléments css de hauteur (height,margin-top,margin-bottom,padding-top,padding-bottom) en pixels je pense que l'espace de la page en hauteur ne sera pas comblé sur tous les supports...
Le but est d'arriver en fin d'intégration de page avec un footer qui finit la page et qui se trouve tout en bas de l'écran sur tous les supports.

Merci

[abc.xyz]

La réponse, je l'ai trouvée, est bien dans une height en % ou alors avec l unité vh qui n'est pas encore compatible partout.

[Muchos]

Merci de nous avoir fait perdre notre temps ! Vous pouvez placez la discussion en RÉSOLU.

[NoSmoking]

La réponse, je l'ai trouvée, est bien dans une height en %...

Merci d'avoir lu la discussion en plein

Ecrit dans celle ci

il te suffit de remplacer les hauteurs en px par des hauteurs en %.

Réflexion : est ce bien intéressant de fixer en % la hauteur du footer, voire du header, le rendu peut devenir vite très sale, attendu que son contenu est la plupart du temps figé ?

Une autre solution serait de regarder du coté des flex-box mais là je n'ai rein dis compte tenu de tes certitudes.

[abc.xyz]

Bonjour,

un moyen de ne pas avoir le contenu figé dans le footer et le header est de le placer avec des margin et padding eux aussi en %, fixer la height des éléments en % prend alors tout sons sens dans ces conditions.