Je voudrais mettre une ligne "Tous droits réservés ..." au bas de la page. J'ai essayé d'utiliser le positionnement absolu, mais cela ne fonctionne pas comme prévu lorsque la fenêtre est redimensionnée à une hauteur plus petite.Comment coller du texte au bas de la page?
Comment puis-je atteindre cet objectif simple?
Vous pouvez mettre la div absolument aligné dans un récipient relativement aligné - cette façon, il sera toujours contenu dans le récipient plutôt que la fenêtre du navigateur.
<div style="position: relative;background-color: blue; width: 600px; height: 800px;">
<div style="position: absolute; bottom: 5px; background-color: green">
TEST (C) 2010
</div>
</div>
Il y a un excellent pied de page collant sur ryanfait.com que j'ai utilisé, et this one semble prometteur aussi.
Essayez:
.bottom {
position: fixed;
bottom: 0;
}
Essayez cette
<head>
<style type ="text/css" >
.footer{
position: fixed;
text-align: center;
bottom: 0px;
width: 100%;
}
</style>
</head>
<body>
<div class="footer">All Rights Reserved</div>
</body>
Je l'ai édité pour le faire fonctionner, en gardant l'idée de le faire au centre, puisque j'en avais aussi besoin, j'espère que d'autres personnes le trouveront utile aussi –
Vous m'avez fait gagner du temps, merci beaucoup. –
Un vieux fil, mais ... Réponse des œuvres Konerak, mais pourquoi la taille même mis d'un conteneur par défaut. Ce que je préfère, c'est d'utiliser du code partout où il n'y a pas de grosses pages. Donc, ce mon code:
<style>
#container {
position: relative;
height: 100%;
}
#footer {
position: absolute;
bottom: 0;
}
</style>
</HEAD>
<BODY>
<div id="container">
<h1>Some heading</h1>
<p>Some text you have</p>
<br>
<br>
<div id="footer"><p>Rights reserved</p></div>
</div>
</BODY>
</HTML>
L'astuce est dans <br> où vous cassez nouvelle ligne. Ainsi, lorsque la page est petite, vous verrez le pied de page au bas de la page, comme vous le souhaitez. MAIS, quand une page est grande et que vous devez la faire défiler vers le bas, votre pied de page va contenir 2 nouvelles lignes sous tout le contenu ci-dessus. Et si vous agrandissez la page, votre pied de page va toujours descendre. J'espère que quelqu'un trouvera cela utile.
Qu'est-ce exactement "ne fonctionne pas comme prévu"? – RoToRa
Un exemple de code avec lequel nous pouvons travailler? – Flatlin3
Que voulez-vous dire par "bas de la page"? Pour cela, vous devez simplement l'ajouter au bas du code HTML. Mais il semble que vous vouliez qu'il soit placé au bas de la * fenêtre * plutôt que sur la page. (Si la page est défilée ou si la fenêtre est redimensionnée, elle devrait toujours coller à la bordure inférieure de la fenêtre. (Est-ce que c'est ce que vous voulez?) – chiccodoro