HTML/CSS/Box Model/border left
Border left Properties
<html>
<head>
<title>Border Properties</title>
<style>
body {font-size: 1.3em;}
p {background-color: white;}
</style>
</head>
<body>
<h1><i>The Border Properties</i></h1>
<p style="border-top: solid thick red;">
A solid, thick, red border with border-top</p>
<p style="border-right: double medium blue; text-align: right;">
A double, medium, blue border with border-right</p>
<p style="border-bottom: dotted thin green;">
A dotted, thin, green border with border-bottom</p>
<p style="border-left: dashed thin navy;">
A dashed, thin, navy border with border-left</p>
<p style="border: inset 3px yellow;">
An inset, 3 pixel, yellow border with border</p>
</body>
</html>
Set border left, right and bottom to an anchor with LI under UL in a DIV
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
#navsite ul li a:hover {
border-left: 10px solid #036;
border-right: 1px solid #69c;
border-bottom: 1px solid #369;
background-color: #69f;
color: #fff;
}
</style>
</head>
<body id="pagespk">
<div id="navsite">
<h5>Site navigation:</h5>
<ul>
<li><a href="" id="linkhom">Home</a></li>
<li><a href="" id="linkabt">About</a></li>
<li><a href="" id="linkarh">Archives</a></li>
<li><a href="" id="linkwri">Writing</a></li>
<li><a href="" id="linkspk">Speaking</a></li>
<li><a href="" id="linkcnt">Contact</a></li>
</ul>
</div>
</body>
</html>