Наши проекты:
Журнал · Discuz!ML · Wiki · DRKB · Помощь проекту |
||
ПРАВИЛА | FAQ | Помощь | Поиск | Участники | Календарь | Избранное | RSS |
[18.221.187.121] |
|
Сообщ.
#1
,
|
|
|
Добрый день!
Сделал такую верстку: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>Title!</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> </head> <body style="background:#ccc;margin:0;"> <div id="wrapper" style="position:fixed;width:100%;height:100%;z-index:1;"> <div id="scroller" style="position:absolute;display:block;width:90px;height:100%;background:#eee;text-align:center;padding:10px 0;cursor:pointer;opacity:0.7;" title="Наверх">Наверх</div> <div id="surface" style="width:900px;margin:0 auto;height:100%;"> <div id="header" style="height:70px;background:#fff;"></div> <div id="separator" style="height:10px;background:#ccc;"></div> <div id="sidebar" style="width:200px;height:400px;background:#fff;float:left;"></div> </div> </div> <div id="page" style="width:900px;margin:0 auto;padding-top:80px;padding-left:210px;z-index:0;box-sizing:border-box;"> <div id="content" style="height:600px;background:#fff;margin-bottom:10px;"></div> <div id="content" style="height:800px;background:#fff;margin-bottom:10px;"></div> <div id="footer" style="text-align:center;padding:20px">Footer! 2015</div> </div> </body> </html> Проблема в том, что при уменьшении размера окна браузера, блок "scroller" перекрывает блоки "header" и "sidebar". Почему так происходит и как это обойти? Результат на сриншоте. Прикреплённый файл2015_10_23_193344.jpg (60,72 Кбайт, скачиваний: 840) Добавлено Черт! Плохая верстка! Блок page перекрывается блоком wrapper и не реагирует на нажатия по ссылкам... |
Сообщ.
#2
,
|
|
|
а зачем heght:100%;?
|
Сообщ.
#3
,
|
|
|
z-index?
|
Сообщ.
#4
,
|
|
|
Всем спасибо за участие! Переделал верстку и добился всего, чего хотел.
Причем сделал тремя разными способами. Прошу извинить за беспокойство. |