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:

Cocoland version
Cocoland - Accueil - Réseaux sociaux
Remplaçant de Coco : quelles solutions pour tchater gratuitement en ligne ? - Accueil - Réseaux sociaux
Dernière version ccleaner gratuit français - Télécharger - Nettoyage
Splitcam ancienne version - Télécharger - Messagerie
Télécharger zuma revenge version complète gratuit - Télécharger - Jeux vidéo

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.

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

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.

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 ?

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...

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

Discussions similaires

pb cam sur cocoland

Cocoland inaccessible

Coco chat connexion sur mobile, le tchat est fermé ?

cocoland