Fibre
<!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>title</title>
<style type='text/css'>
body {
text-align:center;
background:#000000
}
a {
text-decoration:none;
color:#f3ffc7
}
a:hover {
text-decoration: underline;
color:#f3ffc7
}
#wrap {
width:800px;
text-align:left;
margin:0 auto;
color:#8a8a8a
}
.float-l {
float:left
}
.folat-r {
float:right
}
.clearfix {
clear:both
}
/* header */
#header {
background:url(Fibre-images/header.gif) no-repeat;
height:226px
}
#header h1 {
font-size:38px;
padding-top: 40px;
padding-left: 90px;
color:#9cdbfb
}
#header div {
font-size:16px;
padding-left: 90px;
}
ul#nav {
position:absolute;
top:190px;
padding-left:70px;
overflow:hidden;
}
ul#nav li {
float:left;
height:50px;
padding:0 30px;
color:#FFFFFF
}
ul#nav a {
color:#fff
}
/* content */
#content {
padding:0 50px
}
#content .left {
width:352px;
padding-top: 30px;
}
#content .left h2 {
font-size:30px;
background: url(Fibre-images/left.gif) no-repeat;
height:55px;
padding-top: 10px;
padding-left: 10px;
}
#content p {
padding:20px 20px;
}
#content .right {
width: 300px;
padding-top: 30px;
}
#content .right h2 {
font-size:30px;
background: url(Fibre-images/right.gif) no-repeat;
height:55px;
padding-top: 10px;
padding-left: 10px;
}
#top li {
list-style:url(Fibre-images/a1.gif) inside
}
#top a {
color:#f3ffc7;
line-height:20px
}
.submit {
background:url(Fibre-images/a2.gif) no-repeat;
border:0px;
width:21px
}
ul#meun {
padding-bottom:20px
}
ul#meun li a {
padding-left:5px
}
ul#meun, #bm form {
padding-left: 30px;
}
/* footer */
#footer {
clear:both;
background:url(Fibre-images/footer.gif) no-repeat;
height:92px;
text-align:center
}
#ftlink {
padding-top: 12px;
padding-bottom:15px
}
div#scc {
position:absolute;
top:50px;
padding-left: 450px;
}
#scc h2 {
width:50px;
display:inline;
font-size:22px
}
#scc form#sc {
display:inline;
}
#scc form#sc input {
padding:2px
}
</style>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="wrap">
<div id="header">
<h1>Fibre </h1>
<div>short slogan here</div>
<div id="scc">
<h2>Search</h2>
<form action="/" method="post" id="sc">
<input type="text" name="q" id="q" value="" class="q"/>
<input type="submit" name="submit" id="submit" value="" class="submit"/>
</form>
</div>
<ul id="nav">
<li ><a href="#">Home</a></li>
<li class="nd"><a href="#">About us</a></li>
<li ><a href="#">Production</a></li>
<li><a href="#">Submission</a></li>
<li class="nd"><a href="#">Contact</a></li>
</ul>
</div>
<!-- /header -->
<div id="content">
<div id="inner">
<div class="left float-l">
<div class="blog">
<h2>Free CSS Templates</h2>
<p>This is Fibre, 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 class="blog">
<h2>Free CSS Templates</h2>
<p>This is Fibre, 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 class="right folat-r">
<div id="top">
<h2>Sections</h2>
<ul id="meun">
<li><a href="#">Home</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">Production</a></li>
<li><a href="#">Submission</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div id="bm">
<h2>Subscribe</h2>
<form action="/" method="post" id="sc">
<input type="text" name="q" id="q" value="" class="q"/>
<input type="submit" name="submit" id="submit" value="" class="submit"/>
</form>
</div>
</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.
<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>
<!-- /footer -->
</div>
</body>
</html>
Related examples in the same category