Shaun Mccran

My digital playground

26
F
E
B
2009

Scrolling Div areas, using overflow:auto

An easy way to create a scrollable contained area within your template is to use the overflow style property. This can be set to true or false, and also auto, which will add a scroll bar, and allow scrolling if the content exceeds the dimensions of the div.
view plain print about
1<style>
2    #ScrollDiv {width:275px;height:130px;overflow: auto; background-color: #E3E1DD;
3    border-color: #CCCCCC #666666 #666666 #CCCCCC;
4    border: 1px solid;}
5</style>
The DIV code which goes inside your template. This div can be placed inside any element of your page including < td > or other < div >'s.

Suspendisse neque. Nunc urna nisl, varius eget, placerat vitae, mollis in, nisl. Praesent interdum. Duis tempus ligula ut ipsum. Sed dictum massa sit amet tortor. Nulla hendrerit mi a felis. Morbi auctor mauris id lorem. Cras ac magna. Aliquam erat volutpat. Phasellus sed felis. Nunc auctor, est vel adipiscing eleifend, purus tortor pellentesque lacus, sit amet mattis nisi lorem eget quam. Donec dignissim eros dignissim urna. In dolor. Nulla lacus enim, interdum at, interdum vel, faucibus vel, dui. Proin fringilla nisi quis tellus. Integer magna. Aenean iaculis. Ut lacus massa, fermentum dictum, ornare ut, malesuada sed, mauris. Nullam viverra sapien aliquam ligula. Fusce arcu quam, vehicula vel, iaculis at, sagittis eu, enim.

Duis aliquet ornare magna. Nullam pede risus, porttitor at, imperdiet a, gravida at, pede. Maecenas purus magna, cursus eget, sagittis non, elementum vitae, dolor. Integer congue, massa quis pulvinar posuere, nisi neque rutrum justo, ut tincidunt ante felis ut orci. Phasellus venenatis lobortis tellus. Donec mollis felis tristique dolor. Duis molestie porttitor ipsum. Maecenas magna diam, malesuada ut, aliquam quis, mattis at, massa. Nullam quis ante vel enim mollis dictum. Aenean sollicitudin quam non neque. Nam turpis. Vivamus sed lectus. Sed ligula. Etiam at nibh. Aliquam nec lectus eget pede auctor consectetur.

Text thanks to http://www.lipsum.com/

TweetBacks
Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
Back to top