DZone Snippets: html code

DZone Snippets: html code http://snippets.dzone.com/posts Sat, 06 Sep 2008 10:51:46 GMT DZone Snippets: html code Tabs based on definition list http://snippets.dzone.com/posts/show/4113 // description of your code here <br /> <br /><code> <br /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br /><html xmlns="http://www.w3.org/1999/xhtml"> <br /><head> <br /><style type="text/css"> <br />dl.tabstrip { <br />float:left; <br />width:60em; <br />font-size:120%; <br />line-height:normal; <br />background: url("images/tabstripbottom.png") repeat-x bottom; <br />margin:0; <br />padding:8px 8px 0; <br />} <br /> <br />dl.tabstrip dt { <br />float:left; <br />padding:0; <br />margin:0 2px 0 0; <br />} <br /> <br />dl.tabstrip a { <br />display:block; <br />padding: 4px 12px 4px; <br />color:black; <br />font-family:verdana, sans-serif; <br />text-decoration:none; <br />} <br /> <br />dt.selected { <br />background: url("images/tabright.png") top right no-repeat; <br />} <br /> <br />dt.selected a { <br />background: url("images/tableft.png") top left no-repeat; <br />padding-bottom:5px; <br />} <br /> <br /> <br />dt.unselected { <br />background: url("images/unselectedtabright.png") top right no-repeat; <br />} <br /> <br />dt.unselected a { <br />background: url("images/unselectedtableft.png") top left no-repeat; <br />} <br /> <br />.tabstrip dd { <br />position:fixed; <br />left:8px; <br />top: 2.5em; <br />border: 1px solid #6290d2; <br />border-top:none; <br />background:#fff; <br />margin:0; <br />height:10em; <br />width: 60em; <br />padding:8px 8px 8px 6px; <br />} <br /> <br />dd.selected { <br />display:block; <br />} <br /> <br />dd.unselected { <br />display:none; <br />} <br /></style> <br /></head> <br /> <br /><body> <br /><dl class="tabstrip"> <br /> <dt class="unselected"><a href="#">Tracy</a></dt> <br /> <dd class="unselected"> <br /> <p>Position: President</p> <br /> </dd> <br /> <br /> <dt class="selected"><a href="#">Andy</a></dt> <br /> <dd class="selected"> <br /> <p>Position: Architect</p> <br /> </dd> <br /> <br /> <dt class="unselected"><a href="#">Ron</a></dt> <br /> <dd class="unselected"> <br /> <p>Position: Operations Manager</p> <br /> </dd> <br /></dl> <br /></body> <br /></html></code> Thu, 07 Jun 2007 18:18:00 GMT http://snippets.dzone.com/posts/show/4113 AndyV (Andy Vanasse)