Переполнение и положение HTML CSS Div «исправлено» ⇐ Html

[Anonymous]

У меня возникла проблема со стилем с помощью CSS.
У меня есть веб-сайт, который состоит из 4 основных областей и 1 общей области.
Я упростил код и добавил цветовой код к каждой области, чтобы получить более быстрый обзор, но основные области с CSS выглядят так:

Код: Выделить всё

.madegamesDiv {
position: fixed;
z-index: 1;
top: 0px;
left: 0px;
width: 100%;
min-width: 1200px;
height: 34px;
background-color: #778013;
border-bottom: 1px solid #39950E;
}
.allDiv {
position: fixed;
top: 35px;
left: 0px;
width: 100%;
height: 100%;
min-width: 1200px;
min-height: 850px;
background-color: #39950E;
overflow: scroll;
}
.leftDiv {
position: absolute;
z-index: 1;
height: 775px;
float: left;
width: 200px;
overflow: hidden;
position: fixed;
padding: 5px;
background-color: #FFFF00;
}
.topDiv {
min-width: 1000px;
position: fixed;
left: 200px;
top: 35px;
height: 150px;
overflow: hidden;
background-color: #FF00FF;
}
.mainDiv {
width: 100%;
min-width: 800px;
max-width: calc(100% - 500px);
background-color: #FFFFFF;
position: fixed;
left: 50%;
margin-left: calc((100% - 500px)/2*(-1));
top: 160px;
height: calc(100% - 180px - 27px);
overflow: auto;
border: 1px solid #225909;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
padding: 10px;
background-color: #FF0000;
}

Код: Выделить всё

Menu Area


Top Area with logo and other stuff

Main Area
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content
Here is a lot of text and content

Основная область main — это область с наибольшим количеством контента. Его необходимо прокручивать.
Но теперь моя проблема в том, как мне понять, что если окно браузера слишком маленькое, чтобы все области отображались правильно?
Я подумал о том, чтобы сделать всю область прокручиваемой с помощью CSS

Код: Выделить всё

overflow:auto;

или переполнение: прокрутка;. Но это не работает. Я думаю, проблема в том, что другие области имеют положение: фиксированное, и поэтому общая область all не распознает размер других областей. Трудно объяснить, надеюсь, вы понимаете то, что я пытаюсь объяснить.
Есть ли способ отображать полосы прокрутки, когда окно слишком маленькое?
Заранее спасибо за вашу помощь. Если какой-то код отсутствует или что-то неясно, спрашивайте.

Подробнее здесь: https://stackoverflow.com/questions/295 ... tion-fixed