Мне было интересно, найдется ли кто-нибудь способ исправить заголовки диаграммы так, чтобы, как только она достигла верхней части экрана, заголовки оставались в поле зрения. Аналогично этому примеру http://jsfiddle.net/WDnyb/2/ 4
HTML
<div class="header">Header</div>
<div class="outer">
<span class="banner">LOGO</span>
<div class="header">Header</div>
</div>
<div class="content">Content</div>
CSS
.header {
background-color: #ccc;
width: 100%;
position: fixed;
top: 0;
bottom: auto;
}
.outer {
background-color: #fff;
position: relative;
height: 100px;
}
.outer .banner {
font-size: 46px;
}
.outer .header {
position: absolute;
bottom: 0;
z-index: 2;
top: auto;
}
.content {
height: 1500px;
color: blue;
background-color: #fff;
margin-top: 100px;
}
В идеале как заголовки для дополнительных данных, так и даты для представления задачи должны оставаться при вертикальной прокрутке пользователя.