MySpace Scroll Box Borders

Related:
• Scrollbox Generator
• Scroll Box Colors
• Picture Scroll Box
• CSS Borders (How to)
• Scrolling Comments
• Hide MySpace Comments
• Color Chart
• More MySpace Codes

This page contains examples of scroll box borders that you can put on your MySpace scroll boxes. In fact, these scroll box borders will work on any web page. MySpace scroll boxes are created using HTML. Scroll box borders are specified using Cascading Style Sheets (CSS).

To use these HTML/CSS codes, simply copy and paste them into your MySpace profile page and change the values to suit.

Thin Border

Here's a basic border for your scroll box. In the HTML code, I've specified that the border is 1 pixel wide, solid, and a dark green color (hex color value: #6DB72C).

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:1px solid 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Setting borders and colors in HTML is easy - if you know how.

Thick Border

In this example, I've specified that the border is 10 pixels wide. It's still solid and the same color as the previous example.

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px solid 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Dotted Border

To create a dotted border, you simply change the value 'solid' to 'dotted'.

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px dotted 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Dashed Border

To create a dashed border, you simply use the value 'dashed' (instead of 'solid' or 'dotted' as in our previous examples).

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px dashed 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Grooved Borders

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px groove 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Double Borders

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px double 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Ridged Borders

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px ridge 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Outset Borders

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px outset 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Inset Borders

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px inset 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

Mixed Borders

You can use different border styles for each side of your scroll box. With a little imagination, you can achieve some cool results!

HTML Code:

<div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px double 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p>

Result:

This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders.

More About HTML Borders

The following articles explain the HTML/CSS code you need to use to set borders and their colors. There's also a color picker that makes it easy for you to choose any color you like for your scroll boxes (or anything else on your MySpace/web page).

More HTML Codes

Check out our huge range of free HTML codes that you can copy/paste into your website or MySpace page.

And, if you wanna learn more, check out our free HTML tutorial!

MySpace Codes

MySpace Code Generators

Tutorials

MySpace Scroll Box Borders

Thin Border

Thick Border

Dotted Border

Dashed Border

Grooved Borders

Double Borders

Ridged Borders

Outset Borders

Inset Borders

Mixed Borders

More About HTML Borders

More HTML Codes

Enjoy this website?

ABOUT

HTML/MARKUP

CSS & DESIGN

SCRIPTING

DATABASE

WEB HOSTING

MySpace Home MySpace Codes MySpace Background Code MySpace Comment Box Code MySpace Comment Box Borders MySpace Comment Box Color MySpace Comment Box Picture MySpace Scrolling Comments Hide MySpace Comments Hide MySpace Friends MySpace Cursor Code MySpace Font Codes MySpace Music Codes MySpace Marquee Codes MySpace Overlapping Text Code MySpace Scroll Box Code MySpace Scroll Box Borders MySpace Scroll Box Colors MySpace Picture Scroll Box MySpace Slide Show Code MySpace Code Generators MySpace Comment Box Generator MySpace Text Generator MySpace Falling Text MySpace Falling Objects MySpace Layout Generator MySpace Overlapping Text MySpace Marquees MySpace Music Generator MySpace Scrollbox Generator MySpace Slideshow Generator MySpace Profile Editor Code-Generator.net Tutorials MySpace HTML Tutorial Change MySpace Name Change MySpace URL How to Decorate MySpace Create a Website
	MySpace Scroll Box Borders Related: • Scrollbox Generator • Scroll Box Colors • Picture Scroll Box • CSS Borders (How to) • Scrolling Comments • Hide MySpace Comments • Color Chart • More MySpace Codes This page contains examples of scroll box borders that you can put on your MySpace scroll boxes. In fact, these scroll box borders will work on any web page. MySpace scroll boxes are created using HTML. Scroll box borders are specified using Cascading Style Sheets (CSS). To use these HTML/CSS codes, simply copy and paste them into your MySpace profile page and change the values to suit. Thin Border Here's a basic border for your scroll box. In the HTML code, I've specified that the border is 1 pixel wide, solid, and a dark green color (hex color value: #6DB72C). HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:1px solid 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Setting borders and colors in HTML is easy - if you know how. Learn about setting borders Learn about setting colors Choose your colors Thick Border In this example, I've specified that the border is 10 pixels wide. It's still solid and the same color as the previous example. HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px solid 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Dotted Border To create a dotted border, you simply change the value 'solid' to 'dotted'. HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px dotted 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Dashed Border To create a dashed border, you simply use the value 'dashed' (instead of 'solid' or 'dotted' as in our previous examples). HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px dashed 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Grooved Borders HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px groove 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Double Borders HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px double 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Ridged Borders HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px ridge 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Outset Borders HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px outset 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Inset Borders HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px inset 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. Mixed Borders You can use different border styles for each side of your scroll box. With a little imagination, you can achieve some cool results! HTML Code: <div style="height:100px;width:200px;overflow:scroll;background-color:D0F18F;color:53760D;border:10px double 6DB72C;">This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using <a href="/css/" target="_blank">CSS</a>. <a href="/css/tutorial/css_border.cfm" target="_blank">More about CSS borders</a>.</div> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com">Quackit Tutorials</a></p> Result: This is enough sample text to make the box grow scrollbars - then we can call the box a scroll box! Note that the borders are defined using CSS. More about CSS borders. More About HTML Borders The following articles explain the HTML/CSS code you need to use to set borders and their colors. There's also a color picker that makes it easy for you to choose any color you like for your scroll boxes (or anything else on your MySpace/web page). Learn about setting borders Learn about setting colors Choose your colors More HTML Codes Check out our huge range of free HTML codes that you can copy/paste into your website or MySpace page. And, if you wanna learn more, check out our free HTML tutorial! Enjoy this website? Share Add this page to your Favorites Link to this page (copy/paste into your own website or blog): <a href="http://www.quackit.com/myspace/codes/myspace_scroll_box_borders.cfm">MySpace Scroll Box Borders</a> from Quackit.com Link to Quackit using one of these banner ads. Help support Quackit by making a donation Oh, and thank you for supporting Quackit!