spiderdarker
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>spiderDarker</title>
<style type='text/css'>
body {
text-align:center;
}
a {
text-decoration:none;
}
a:hover {
text-decoration: underline;
}
#wrap {
width:800px;
text-align:left;
margin:0 auto;
}
.float-l {
float:left
}
.folat-r {
float:right
}
.clearfix {
clear:both
}
.left {
}
.right {
padding:0 40px
}
.right a {
color:#f8920b;
text-decoration:underline;
line-height:20px
}
#side-left li {
list-style:url(spiderdarker-images/ar.gif) inside
}
/* header */
#header {
background:url(spiderdarker-images/header.gif) no-repeat;
height:180px
}
#logo {
position:relative;
top:75px;
left:35px;
color:#FFFFFF
}
#logo h1 {
font-size:34px;
}
#logo div {
padding-left: 90px;
}
ul#nav {
position:relative;
top:40px;
left:420px
}
ul#nav li {
float:left;
padding-right:20px;
width:70px;
text-align:center
}
/* content */
#content {
background:url(spiderdarker-images/content.gif) no-repeat;
height: 467px
}
#content .right h2 {
color:#f8920b;
font-size:30px;
padding:20px 0
}
#content p {
padding-bottom:10px;
}
#content .right a:hover {
text-decoration:none;
color:#CC3300
}
.left {
padding:20px 0px 0 80px;
height: 210px;
}
.left h2 {
padding:20px 0;
}
.blog {
width:190px;
padding:0 50px 0 10px;
float:left;
}
.blog a {
color:#f8920b;
line-height:20px
}
.blog li {
list-style:outside disc;
color:white
}
.blog h2 {
font-size:22px;
color:#fff
}
.last {
padding-right: 0px
}
.right {
clear:both;
padding:40px 40px 0 90px;
width: 630px;
}
/* footer */
#footer {
background:url(spiderdarker-images/footer.gif) no-repeat;
height:153px;
padding-left: 50px;
color:#f8920b
}
#ftlink {
padding-top: 80px;
}
#xhtml {
position:relative;
top:-20px;
left:500px
}
#header a, #footer a {
color:#FFFFFF
}
</style>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="wrap">
<div id="header">
<div id="logo">
<h1>spiderDarker</h1>
<div>short slogan here</div>
</div>
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">Production</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<!-- /header -->
<div id="content">
<div id="inner">
<div class="left ">
<div class="blog first">
<h2>Sections 1</h2>
<ul class="meun">
<li><a href="#">Latin literature </a></li>
<li><a href="#">making over years </a></li>
<li><a href="#">Richard Clintock </a></li>
<li><a href="#">Latin professor </a></li>
<li><a href="#">Hampden Sydney </a></li>
</ul>
</div>
<div class="blog ">
<h2>Sections 1</h2>
<ul class="meun">
<li><a href="#">Latin literature </a></li>
<li><a href="#">making over years </a></li>
<li><a href="#">Richard Clintock </a></li>
<li><a href="#">Latin professor </a></li>
<li><a href="#">Hampden Sydney </a></li>
</ul>
</div>
<div class="blog last">
<h2>Sections 1</h2>
<ul class="meun">
<li><a href="#">Latin literature </a></li>
<li><a href="#">making over years </a></li>
<li><a href="#">Richard Clintock </a></li>
<li><a href="#">Latin professor </a></li>
<li><a href="#">Hampden Sydney </a></li>
</ul>
</div>
</div>
<div class="right">
<h2>Free CSS Templates</h2>
<p>This is spiderDarker, a free, fully standards-compliant CSS template designed by <a href="http://www.free-css-templates.com/">Free CSS Templates</a>.
This free template is released under a Creative Commons Attributions 2.5 license, so youre pretty much free to do whatever you want with it (even use it commercially) provided you keep the links in the footer intact. Aside from that, have fun with it :) </p>
</div>
</div>
</div>
<!-- /content -->
<div id="footer">
<div id="ftlink"> <a href="#">Home</a> | <a href="#">About Us</a> | <a href="#">Production</a> | <a href="#">Submission</a> | <a href="#">Contact</a> </div>
<p id="copyright"> 2008. All Rights Reserved. <br/>
<a href="http://www.templatesold.com/" target="_blank">Website Templates</a> by <a href="http://www.free-css-templates.com/" target="_blank">Free CSS Templates</a></p>
<div id="xhtml"><img src="spiderdarker-images/xhtml.gif" alt=" xhtml vaild" /> <img src="spiderdarker-images/css.gif" alt="css vaild" /></div>
</div>
<!-- /footer -->
</div>
</body>
</html>
Related examples in the same category