|
Сообщение от danik.js
|
|
Скрыть у второго элемента скролл и обернуть оба в третий, у которого отображается скроллбар. Самый простой и эффективный вариант
|
согласен, и скриптов не надо будет)))
<style>
div.block {
owerflow-y: scroll;
height: 300px;
}
div.block div {
display: table-cell;
border: 1px solid #000;
}
</style>
<div class="block">
<div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam aliquet justo elit, eget cursus quam semper eget. Proin posuere nunc sit amet lacus facilisis, in fermentum nisl vehicula. Nullam ornare ultricies ipsum, non interdum ligula venenatis eget. Phasellus iaculis risus a aliquet imperdiet. Nullam molestie egestas laoreet. Curabitur egestas turpis a lacinia rutrum. Nullam euismod iaculis ullamcorper. Mauris odio justo, luctus at mi at, mattis dictum diam. Maecenas tempus enim ac purus fermentum pretium. Vestibulum egestas tortor eu ligula rutrum, sed posuere diam aliquam. Nunc luctus rhoncus pretium. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Cras vestibulum tempor neque, eget pellentesque nulla dapibus tempus. Suspendisse porttitor felis eu ultrices adipiscing. Integer id sodales elit. </p>
<p>Suspendisse blandit blandit erat, ac vulputate ante hendrerit sed. Nullam quis orci et erat vehicula tincidunt eu id lectus. Nunc ligula eros, dictum ac sapien non, accumsan ultricies tortor. Mauris tempus vel leo aliquet tempor. Ut non eros imperdiet, pretium dui id, rutrum orci. Vivamus et turpis gravida, cursus nulla at, consectetur diam. Mauris suscipit non justo id rhoncus. Phasellus vulputate mi eu lectus tempus, fermentum iaculis libero aliquet. Cras dictum nibh odio, sed pellentesque metus aliquam vel. Cras euismod, neque in venenatis ullamcorper, arcu ipsum eleifend est, non elementum orci neque in felis. Quisque erat diam, ultricies nec gravida nec, adipiscing a leo. Praesent viverra in libero a iaculis. Etiam sit amet nisl non leo bibendum rhoncus.</p>
<p>Curabitur pulvinar, urna id tempus suscipit, nisl ipsum vulputate velit, quis lacinia lectus tellus ut metus. Phasellus posuere porttitor nunc sit amet pretium. Nulla at erat leo. Donec sed dui sit amet sem elementum fringilla. Nulla ac metus ut magna lobortis dictum. Quisque sit amet libero a nibh sodales rhoncus ut a arcu. Praesent euismod sit amet nulla eu placerat. Donec facilisis sollicitudin tempus.</p>
<p>Praesent sit amet est a leo ornare imperdiet. Nullam tempus, lorem et tincidunt malesuada, erat enim vestibulum risus, nec facilisis ante enim sit amet ipsum. In augue turpis, molestie nec accumsan et, malesuada vitae est. Duis vestibulum tempus justo, sed imperdiet magna suscipit sit amet. Sed tellus mi, volutpat id convallis eget, lacinia quis magna. In ullamcorper rutrum nibh, at tincidunt ligula congue nec. Maecenas et scelerisque velit. Morbi interdum aliquet sapien, ut mollis arcu pulvinar vitae.</p>
<p>Nullam condimentum hendrerit rhoncus. Maecenas auctor ipsum id porta consequat. Vivamus in pulvinar tellus, a ultrices magna. Pellentesque scelerisque leo dolor, eu porta dolor consectetur congue. Aenean ornare, lorem a lacinia cursus, turpis enim imperdiet metus, et tempor tortor urna sed dui. Ut laoreet, ipsum elementum molestie eleifend, felis mauris sollicitudin mi, ac tempus nisl dolor vitae neque. Aliquam erat volutpat. Suspendisse potenti. Curabitur ultrices massa consequat, porta sem at, pulvinar orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vel libero malesuada, auctor massa et, imperdiet nunc. Maecenas scelerisque interdum nulla ut semper. Vestibulum varius aliquet metus at tristique.</p></div>
<div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam aliquet justo elit, eget cursus quam semper eget. Proin posuere nunc sit amet lacus facilisis, in fermentum nisl vehicula. Nullam ornare ultricies ipsum, non interdum ligula venenatis eget. Phasellus iaculis risus a aliquet imperdiet. Nullam molestie egestas laoreet. Curabitur egestas turpis a lacinia rutrum. Nullam euismod iaculis ullamcorper. Mauris odio justo, luctus at mi at, mattis dictum diam. Maecenas tempus enim ac purus fermentum pretium. Vestibulum egestas tortor eu ligula rutrum, sed posuere diam aliquam. Nunc luctus rhoncus pretium. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Cras vestibulum tempor neque, eget pellentesque nulla dapibus tempus. Suspendisse porttitor felis eu ultrices adipiscing. Integer id sodales elit.</p>
<p>Suspendisse blandit blandit erat, ac vulputate ante hendrerit sed. Nullam quis orci et erat vehicula tincidunt eu id lectus. Nunc ligula eros, dictum ac sapien non, accumsan ultricies tortor. Mauris tempus vel leo aliquet tempor. Ut non eros imperdiet, pretium dui id, rutrum orci. Vivamus et turpis gravida, cursus nulla at, consectetur diam. Mauris suscipit non justo id rhoncus. Phasellus vulputate mi eu lectus tempus, fermentum iaculis libero aliquet. Cras dictum nibh odio, sed pellentesque metus aliquam vel. Cras euismod, neque in venenatis ullamcorper, arcu ipsum eleifend est, non elementum orci neque in felis. Quisque erat diam, ultricies nec gravida nec, adipiscing a leo. Praesent viverra in libero a iaculis. Etiam sit amet nisl non leo bibendum rhoncus.</p>
<p>Curabitur pulvinar, urna id tempus suscipit, nisl ipsum vulputate velit, quis lacinia lectus tellus ut metus. Phasellus posuere porttitor nunc sit amet pretium. Nulla at erat leo. Donec sed dui sit amet sem elementum fringilla. Nulla ac metus ut magna lobortis dictum. Quisque sit amet libero a nibh sodales rhoncus ut a arcu. Praesent euismod sit amet nulla eu placerat. Donec facilisis sollicitudin tempus.</p>
<p>Praesent sit amet est a leo ornare imperdiet. Nullam tempus, lorem et tincidunt malesuada, erat enim vestibulum risus, nec facilisis ante enim sit amet ipsum. In augue turpis, molestie nec accumsan et, malesuada vitae est. Duis vestibulum tempus justo, sed imperdiet magna suscipit sit amet. Sed tellus mi, volutpat id convallis eget, lacinia quis magna. In ullamcorper rutrum nibh, at tincidunt ligula congue nec. Maecenas et scelerisque velit. Morbi interdum aliquet sapien, ut mollis arcu pulvinar vitae.</p>
<p>Nullam condimentum hendrerit rhoncus. Maecenas auctor ipsum id porta consequat. Vivamus in pulvinar tellus, a ultrices magna. Pellentesque scelerisque leo dolor, eu porta dolor consectetur congue. Aenean ornare, lorem a lacinia cursus, turpis enim imperdiet metus, et tempor tortor urna sed dui. Ut laoreet, ipsum elementum molestie eleifend, felis mauris sollicitudin mi, ac tempus nisl dolor vitae neque. Aliquam erat volutpat. Suspendisse potenti. Curabitur ultrices massa consequat, porta sem at, pulvinar orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vel libero malesuada, auctor massa et, imperdiet nunc. Maecenas scelerisque interdum nulla ut semper. Vestibulum varius aliquet metus at tristique.</p></div>
</div>