CSS Demo: Borders Code

<HEAD>
 <TITLE>Borders- explain</TITLE>
 <STYLE>
 <!--
.simple	{border-width:3px;
		 border-color:#008080;
		 border-style:solid;
		 display:in-line;}
.groove	{border-width:16px;
		 border-color:#0000FF;
		 border-style:groove;}
.inset	{border-width=10px;
		 border-color:#0000FF;
		 border-style:inset;}
.mixed	{border-top-width:10px;
		 border-top-color:#0000FF;
		 border-top-style:solid;
		 border-right-width:12px;
		 border-right-color:#000080;
		 border-right-style:ridge;
		 border-bottom-width:16px;
		 border-bottom-color:#008080;
		 border-bottom-style:double;
		 border-left-width:12px;
		 border-left-color:blue;
		 border-left-style:solid;}
.division	{border: 8px #FF8000 outset;
			margin:30px}
.inicap	{font-size:20pt}
//-->
 </style>
</HEAD>

<BODY>
<p class=groove><span class=inicap>W</span>
e now have BORDER for all elements. We can
set the width, style, and color for each side.
IE4 won't apply with SPAN and NC4 won't with
IMG. NC4 won't mix borders.
<p class=simple>A simple <span class=simple>
teal</span> border from the P tag

<blockquote class=mixed>Mixed borders from a
BLOCKQUOTE tag (IE) </blockquote>
<div class=division>
<center>
Outset orange border from DIV tag with margin set
</center><IMG  class="groove" SRC=
"vols.gif" WIDTH=69 HEIGHT=47 ALT="Vols logo"
 align=middle> Groove border from image tag (IE4)
<p><span class="groove"><IMG
SRC="vols.gif" WIDTH=69 HEIGHT=47  ALT="Vols logo"
 align=middle></span>
<p> Groove border around image from span tag(NC4)
</div>
</BODY>
</HTML>