|
<html>
<head>
<link rel=StyleSheet href='csspositioning1.css' type=text/css>
</head>
<body>
<ul>
<li class=thirdTab>Tab 3</li>
<li class=secondTab>Tab 2</li>
<li class=firstTab>Tab 1</li>
</ul>
<div class=contentArea>Content Area</div>
</body>
</html>
li {
width: 100px;
float: right;
border-left: 1px solid black;
border-top: 1px solid black;
list-style:none;
text-align: center;
color: blue;
font-weight: bold;
}
.firstTab {
background-color: #F0E68C;
}
.secondTab {
background-color: #98FB98;
border-bottom: 1px solid black;
}
.thirdTab {
border-right: 1px solid black;
border-bottom: 1px solid black;
background-color: #D3D3D3;
}
.contentArea {
position: relative;
bottom: 2px;
height: 100%;
clear: right;
border: 1px solid black;
background-color: #F0E68C;
z-index:-1;
}
|