Насколько мне известно, элемент с абсолютным позиционированием и плавающий элемент удаляются из нормального потока html (поправьте меня, если я ошибаюсь).
Вот мой jsFiddle
Вот мой код:
<header> </header>
<div class="content-area">
<div class="left-sidebar"></div>
<div class="main-area"></div>
<div class="right-sidebar"></div>
</div>
<footer> </footer>
мой CSS:
.content-area {
position: relative;
min-height: 310px;
background-color: #bbb;
}
.left-sidebar {
position:absolute;
float: left;
width: 50px;
height: 100%;
background-color: #abcdef;
}
.right-sidebar {
position: absolute;
right: 0;
width: 50px;
height: 100%;
background-color: #abcdef;
}
когда я пишу что-нибудь внутри своего main-area
, почему правая боковая панель скользит вниз.