style="BACKGROUND-COLOR: #67f152; WIDTH: 200px; SCROLLBAR-BASE-COLOR: #52dc0d; HEIGHT: 100px; COLOR: #a6120d; OVERFLOW: scroll">This HTML scroll box has had color added. You can add color to the background of your scroll box. You can also add color to the scroll bars.

Change the color of your scroll box!

Scroll Box with Images

You can also add images to your scroll box. This can be either a background image, or, one or more foreground images. Click on the link to add images to your scroll box!

Add an image to your scroll box!

<!-- Codes by Quackit.com -->
<div style="height:221px;width:330px;overflow:scroll;">
<img src="https://i516.photobucket.com/albums/u323/natural_pics/milford_sound.jpg" border="0" width="330" height="221" alt="Sample picture for scroll box: Milford Sound, New Zealand" /><br />
<img src="https://i516.photobucket.com/albums/u323/natural_pics/franz_josef_glacier2.jpg" border="0" width="330" height="221" alt="Sample picture for scroll box: Franz Josef Glacier, New Zealand" />
</div>
<p style="font-size:10px;"><a href="https://www.quackit.com/html/codes/">HTML code</a></p>
 

Scroll Box Borders

Here's an example of an HTML scroll box with a border added. Click on the link to add a border to your scroll box!

<!-- HTML codes by Quackit.com -->
<div style="height:80px;width:180px;overflow:scroll;border:1px solid #0ADA0A;">You can add borders to HTML scroll boxes using the CSS 'border' property. Borders can be of any thickness, and any color. You can specify whether it's solid, dotted, dashed, and more. You can also specify a different border for each side of your scroll box.</div>
<p style="font-size:10px;"><a href="https://www.quackit.com/html/codes/">HTML code</a></p>
 

Horizontal Scroll

Here's an example of an HTML scroll box with a horizontal scroll only. Click on the link to add horizontal scrolling to your scroll box!

<!-- HTML Codes by Quackit.com -->
<div style="border:1px solid black;width:200px;height:100px;overflow-y:hidden;overflow-x:scroll;">
<p style="width:250%;">
By using overflow-x, we can create scroll bars when the contents of this div are wider than the container. By setting this paragraph to 250 percent, it is 250 percent wider than the parent container - forcing an overflow.
</p>
</div>
<p style="font-size:10px;"><a href="https://www.quackit.com/html/codes/">HTML code</a></p>
 

--