Зафиксированный на экране блок

Для просмотра эффекта фиксации блока воспользуйтесь прокрутнкой страницы

Исходный код этого примера:

<style>
.Banner{
  position:fixed;
  display:inline-block;
  height:100px;
  width:200px;
  border:red solid 1px;
  padding:10px;
  background-color: #77F5FE;
}
.Banner-top{
  position:fixed;
  height:100px;
  width:200px;
  border:blue solid 1px;
  padding:10px;
  top:130px;
  left:30px;
  background-color: #77F5FE;
}
.Banner-bottom{
  position:fixed;
  height:100px;
  width:200px;
  border:green solid 1px;
  padding:10px;
  bottom:4px;
  right:10px;
  background-color: #77F5FE;
}
</style>

<h1>Зафиксированный на экране блок</h1>

<p>Для просмотра эффекта фиксации блока воспользуйтесь прокрутнкой страницы</p>

<div class="Banner">Этот блок зафиксирован в потоке вывода</div>
<div class="Banner-bottom">Этот блок зафиксирован относитльно низа рабочей области экрана</div>
<div class="Banner-top">Этот блок зафиксирован относитльно верха рабочей области экрана</div>