Maison > interface Web > tutoriel CSS > Comment positionner un pied de page en bas du navigateur dans Firefox et Internet Explorer ?

Comment positionner un pied de page en bas du navigateur dans Firefox et Internet Explorer ?

Patricia Arquette
Libérer: 2024-10-31 20:33:02
original
987 Les gens l'ont consulté

How to Position a Footer at the Bottom of the Browser in Firefox and Internet Explorer?

Positionnement du pied de page en bas avec CSS

De nombreux développeurs rencontrent des problèmes lorsqu'ils tentent de positionner un pied de page en bas d'une fenêtre de navigateur. Malgré diverses techniques suivies, le pied de page peut apparaître au milieu à la place. Voici une solution à ce problème courant pour Firefox et Internet Explorer.

Code CSS

Le code CSS suivant collera efficacement le pied de page au bas du navigateur :

<code class="css">#Footer {
  position: absolute;
  bottom: 0;
  width: 100%;
}</code>
Copier après la connexion

Explication

  1. position : absolue; : Supprime le pied de page du flux normal du document, lui permettant d'être positionné indépendamment.
  2. bottom: 0; : Définit le bord inférieur du pied de page à zéro, ce qui le positionne en bas de la fenêtre.
  3. width : 100%; : garantit que le pied de page s'étend sur toute la largeur de l'écran.

Structure HTML

Assurez-vous que votre structure HTML contient un < ;div> avec l'id="Footer" pour le pied de page :

<code class="html"><form>
  ...
  <div class="Main" />
  <div id="Footer" />
</form></code>
Copier après la connexion

Notes supplémentaires

  • Position de réglage : fixe ; le pied de page peut fonctionner pour Firefox mais pas pour Internet Explorer.
  • Ajuster la marge ou le remplissage du contenu principal (class="Main") peut être nécessaire pour libérer de l'espace pour le pied de page.

En appliquant ces styles CSS, vous devriez pouvoir positionner avec succès le pied de page en bas de la fenêtre du navigateur dans Firefox et Internet Explorer.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal