Sujet Précédent Sujet Suivant

Problème positionnement footer version mobile

Fermé
dilakk Messages postés 9 Date d'inscription samedi 25 juillet 2015 Statut Membre Dernière intervention 26 juillet 2015 - 25 juil. 2015 à 20:23
dilakk Messages postés 9 Date d'inscription samedi 25 juillet 2015 Statut Membre Dernière intervention 26 juillet 2015 - 26 juil. 2015 à 12:51
Bonjour,

J'ai un problème sur la version mobile de mon site. Par exemple sur cette page http://opihunter.com/registration.php le footer remonte et chevauche mes blocs lorsqu'on clique sur une zone de texte.

J'ai cherché partout sans résultat.

voici le code de mon footer: 

 


footer
{
    width: 100%;
    height:60px;
    border: 1px black inset;
    background-color: rgb(249, 255, 250) ;
    position: absolute;
    bottom:0;      
}

A voir également:

1 réponse

Réponse 1 / 1
ElementW Messages postés 4816 Date d'inscription dimanche 12 juin 2011 Statut Contributeur Dernière intervention 5 octobre 2021 1 228
25 juil. 2015 à 20:40
'lut, c'est la faute à ton 
.registration_form
que tu as mis en 
position: absolute
, ça le fait sortir de la mise en page standard de la page et tu te vois obligé de créer artificiellement l'occupation horizontale avec la règle 
min-height: 100%;
de ton 
#container
, ce qui fait que l'emplacement de ton footer n'est pas bon et repasse certains champs.
Il faut donc ré-inclure ton formulaire dans le flux de la page en le retirant de son positionnement absolu ainsi que ses coordonnées manuelles, en le mettant en 
display: inline-block
et attribuant 
text-align: center;
à son parent, 
#body
pour le centrer.
2
dilakk Messages postés 9 Date d'inscription samedi 25 juillet 2015 Statut Membre Dernière intervention 26 juillet 2015
25 juil. 2015 à 22:21
Salut,

Merci pour ta réponse. Mais je n'obtiens pas le résultat souhaité. Le "registration_form" se retrouve dans le coin en haut à droite
0
ElementW Messages postés 4816 Date d'inscription dimanche 12 juin 2011 Statut Contributeur Dernière intervention 5 octobre 2021 1 228
25 juil. 2015 à 22:49
Ma démarche: (ça marche chez moi si j'utilise l'inspecteur d'objet de FF et modifie les styles): 
.registration_form
  /* À enlever de ta feuille de style générale ET responsive! */
  - position: absolute;
  - top: 5%;
  - right: 33%;
  + display: inline-block;
#body
  + text-align: center;
Soit dit en passant le style et l'organisation des balises HTML actuel est... heu... mauvaise.
0
dilakk Messages postés 9 Date d'inscription samedi 25 juillet 2015 Statut Membre Dernière intervention 26 juillet 2015
25 juil. 2015 à 23:49
Ca marche ! Merci !

Que me conseille tu pour mes balises HTML ?
0
ElementW Messages postés 4816 Date d'inscription dimanche 12 juin 2011 Statut Contributeur Dernière intervention 5 octobre 2021 1 228 > dilakk Messages postés 9 Date d'inscription samedi 25 juillet 2015 Statut Membre Dernière intervention 26 juillet 2015
26 juil. 2015 à 00:47
La redondance <body>/élément nommé "body", le container qui est peut-être en trop...
0
dilakk Messages postés 9 Date d'inscription samedi 25 juillet 2015 Statut Membre Dernière intervention 26 juillet 2015
26 juil. 2015 à 12:51
Okok je vois à peu près. Merci
0

Discussions similaires

Cocoland inaccessible
Chris -
bazfile -

1 réponse
cocoland
vbfbr -
fred972 -

6 réponses
pb cam sur cocoland
benito86 -
benito86 -

5 réponses
Coco chat connexion sur mobile, le tchat est fermé ?
Pisceneo -
brucine -

24 réponses