Фиксированный резиновый блок с прокруткой содержимого

Фиксированный резиновый блок с прокруткой содержимого


Если вам нужен фиксированный резиновый блок с прокруткой содержимого, чтобы сам блок менялся под размеры экрана. Высота и ширина блока не заданы.

  1. Темно-серый страница сайта без прокрутки.
  2. Светло-серый блок с прокруткой, который подстраивается под размер экрана.

Решение

Css

#block{
position:absolute;
left:200px;
right:200px;
top:150px;
bottom:150px;
overflow:auto;
border:1px solid black;/*Чтобы были видны границы блока*/
}

Html

<div id="block">Контент</div>
Фон на всю ширину и высоту страницы... body { background: url(...) no-repeat center center fixed; -webkit-background-size: 100%; -moz-background-size: 100%; -o-backgroun...
Читайте также  3D эффект текста с помощью CSS

Сохрани, чтобы не потерять