web-dev-qa-db-fra.com

Placez une div en bas de l'écran, pas une page

J'essaie de placer une barre grise au bas de l'écran de ma page Web, quelle que soit la résolution. Cependant, lorsque j'essaie, cela semble simplement monter ou descendre quand je vais dans une résolution différente. Est-ce qu'il y a un moyen de réparer ceci?

En outre, la barre est composée de CSS utilisant la balise div id.

/* HTML*/
<div id="info">Scroll for info</div>

/* CSS */
<style>
#info { 
    height: 40px; 
    position: relative; 
    margin-top: 25%; 
    background-color: #393838; 
    opacity: 
}
</style>

EDIT: Je veux que ce soit en bas de l'écran, mais quand je le fais défiler, il monte vers le haut de mon écran.

19
Nikolas

Si vous le voulez en bas et toujours en bas, vous devez utiliser position: fixed. Vous pouvez essayer ceci:

#info { 
    height: 40px; 
    position: fixed; 
    bottom:0%;
    width:100%; 
    background-color: #393838; 
    opacity: 1;
}

http://jsfiddle.net/rX4nd/1/

39
putvande

Que diriez-vous d'ajouter entrer aussi?

.someDiv {
  position:fixed;
  width:50%;
  height:300px;
  margin-left:-25%;
  background:#063;
  bottom:0px;
  left:50%;
}
0
MastaBaba