Problème positionnement footer version mobile
dilakk
Messages postés
9
Statut
Membre
-
dilakk Messages postés 9 Statut Membre -
dilakk Messages postés 9 Statut Membre -
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:
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;
}
1 réponse
-
'lut, c'est la faute à ton
.registration_form
que tu as mis enposition: 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èglemin-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 endisplay: inline-block
et attribuanttext-align: center;
à son parent,#body
pour le centrer.-
-
Ma démarche: (ça marche chez moi si j'utilise l'inspecteur d'objet de FF et modifie les styles):
.registration_form
Soit dit en passant le style et l'organisation des balises HTML actuel est... heu... mauvaise.
/* À enlever de ta feuille de style générale ET responsive! */
- position: absolute;
- top: 5%;
- right: 33%;
+ display: inline-block;
#body
+ text-align: center; -
-
-
