There can be times when adding a scrolling text area on a webpage can be useful. Getting one that is cross browser compatible can be a bit difficult at times, so I hope the instructions below are of use to you.
This one works In IE, Firefox, Safari and Opera but I have not tested it in anything else, and you can use html within the box area.
This is an example of a scroll box where contents can be displayed using html.
|For this box to work correctly, it must be placed within the <td> tag of a Table.|
You will find the full css code for this example below.
Below is the code, change the colours and sizes to suit the layout you want.
Please Note:- The code must be placed above the </head> tag on your webpage.
Now for the html code to display your scroll box within your web page,
This css scroll box has many uses and although it is designed to work within a table, it can also be used within a div tag as below.
This is the Scrolling Area used within a div tag.
<div><class="scroll"><img src="your.jpg" class="right" border=0 width=192 height=80 alt="Logo">
This is the Scrolling Box Area used within a div tag.
Just change the width, to match your layout, and height setting to whatever you want.
Another simple way to add a scrolling area to your page is by adding a div style tag instead of adding a class to your style sheet, Code is below.
<div style="width: 830px; height: 90px; overflow: auto; padding: 5px;">
using this would produce the box below.
Please Note: Do not forget to close your DIV tags when using the above 2 examples.