Тема: Позиціонування блоків
Є ось такий приклад коду:
HTML
<div class="main">
</div>
<div class="bottom1">
<div class="bottom">
</div>
</div>CSS
.main {
position: relative;
margin: 0 auto -100px;
width: 600px;
height: 2000px;
background: green;
}
.bottom1 {
position: relative;
margin: 0 auto;
width: 600px;
}
.bottom {
position: relative;
width: 200px;
height: 100px;
background: red;
left: 500px;
}Ось здублював на JSFiddle: https://jsfiddle.net/sa08cf8b/
Потрібно зробити так, щоб при зменшенні ширини огляду червоний блок внизу просто поступово зникав у правому краю, а смуга прокрутки з'являлася лише тоді, коли ширина менша 600 пікс, тобто вже зачіпає зелений основний блок.
Є ідеї?
