loadfoov2
<!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" xml:lang="en" lang="en">
<head>
<title>LoadFoO [V2]</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<style type='text/css'>
/* */
/* Created by Devit Schizoper */
/* Created HomePages http://LoadFoo.starzonewebhost.com */
/* Created Day 01.12.2006 */
/* */
body {
margin: 0px;
background: url(loadfoov2-img/top_bg.gif);
background-repeat: repeat-x;
font-family: Verdana, Arial, sans-serif;
font-size: .6em;
}
p {
line-height: 17px;
margin: 11px 0 10px 0;
padding: 0px;
}
h2 {
color: #9f9f9f;
margin:0px;
padding:0px;
font-size: 15px;
}
ul {
font-size: 10px;
margin:0;
padding:0;
list-style-image: url(loadfoov2-img/bullet.gif);
}
a {
color: #93B300;
}
a:hover {
text-decoration: none;
}
blockquote{
background: #F7FDE3;
color: #606060;
padding: 10px;
}
/**** Main Container ***/
#wrap {
margin-left: auto;
margin-right: auto;
width: 730px;
}
/**** Top ***/
#top {
width: 100%;
height: 88px;
color: #fff;
background: #000 url(loadfoov2-img/top_bg.gif);
overflow:hidden;
}
#top h2 {
color: White;
letter-spacing: 3px;
font-size: 2.4em;
font-weight: normal;
position: relative;
margin: 0px;
top:33px;
display:block;
float:left;
background: url(loadfoov2-img/bg_t.gif) no-repeat;
padding-left: 10px;
}
#top h2 a {
color: white;
text-decoration: none;
}
#top h2 a:hover {
color: #93B300;
}
/**** Main Menu ***/
#menu {
display: block;
float:right;
}
#menu ul {
margin: 0;
list-style: none;
}
#menu li {
display: block;
float: left;
white-space: nowrap;
}
#menu li a {
display: block;
padding: 55px 20px 12px 20px;
text-decoration: none;
color: #fff;
font-weight: bold;
}
* html #menu a {width:1%;}
#menu li a:hover {
background: url(loadfoov2-img/bg_menu.gif);
}
#menu li a.current {
letter-spacing: 1px;
color: gray;
background: url(loadfoov2-img/bg_menu.gif);
}
#menu li a.current:hover {
color: #fff;
}
/**** Content Container ***/
#content {
width: 100%;
margin-top:30px;
}
#content h2 {
margin: 0;
padding: 10px 0 10px 0;
}
/**** Content ***/
#left ul {
padding: 15px 0 15px 35px;
margin:0;
}
#left li {
margin-bottom:5px;
}
#left {
width: 390px;
float:left;
display: block;
margin-left: 20px;
display: inline;
}
/**** Sidebar ***/
#right {
width: 315px;
float: right;
display:block;
margin-top: 10px;
}
#right .box {
width: 24em;/*280px*/
background: #F6F9FB;
border: 1px solid #E1E1E1;
padding:10px 10px 15px 10px;
float: right;
}
#right .box h2 {
font-size: 1.1em;
margin: 0px 0 0px 0;
padding:0px 0 5px 0;
}
#right .box a {
margin: 10px 0 10px 0;
color: #93B300;
font-size: 10px;
}
#right .box p {
margin: 5px 0 10px 0;
line-height: 15px;
}
#right .box ul {
padding: 0 0 7px 20px;
margin:10px 0 10px 0;
}
#right .box li {
margin-top:5px;
}
#nav{ list-style: none; margin: 2.0em 0; width: 25em; float: right;}
#nav li{ padding: 0; margin: 0; }
#nav a{
display: block;
height: 2.0em;
padding: 0.3em 0.3em 0.3em 0.8em;
border-bottom: 2px; /*solid #1a1a1a*/
border-top: 2px; /*solid #1a1a1a*/
color: #93B300;
background-color: #F7F9FB;
font-weight: bold;
text-decoration: none;
}
#nav a:hover{
color: #1a1a1a;
background: url(loadfoov2-img/bg_t.gif) no-repeat;
background-color: #fff;
font-weight: bold;
}
/**** Clear Div ***/
#clear {
display: block;
clear: both;
width: 100%;
height:1px;
overflow:hidden;
}
/**** Footer ***/
#footer {
margin: 40px auto 0 auto;
text-align: center;
border-top: dotted 1px gray;
padding: 20px 0 20px 0;
width: 70%;
}
#footer p {
margin: 0px;
padding: 0;
}
</style>
<script type="text/javascript" src="js/textsizer.js"></script>
<script type="text/javascript" src="js/rel.js"></script>
</head>
<body>
<div id="wrap">
<div id="top">
<h2><a href="http://www.free-css.com/">LoadFoO [V2]</a></h2>
<div id="menu">
<ul>
<li><a href="http://www.free-css.com/" class="current">home</a></li>
<li><a href="http://www.free-css.com/">about</a></li>
<li><a href="http://www.free-css.com/">portofolio</a></li>
<li><a href="http://www.free-css.com/">contact</a></li>
</ul>
</div>
</div>
<div id="content">
<div style="float: right;"><a href="javascript:ts('body',1)">[+]</a> | <a href="javascript:ts('body',-1)">[-]</a></div>
<div id="left">
<h2>Welcome to LoadFoO [V1]</h2>
<p>Text Content Text <a href="http://www.free-css.com/">Content Text</a> Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content.</p>
<ul>
<li>ul-li test.</li>
<li>ul-li test.</li>
<li>ul-li test.</li>
<li>ul-li test.</li>
<li>ul-li test.</li>
</ul>
<h2>Functionality or performance</h2>
<p>Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content Text Content. </p>
</div>
<div id="right">
<ul id="nav">
<li><a href="http://www.free-css.com/">Home</a></li>
<li><a href="http://www.free-css.com/">Archive</a></li>
<li><a href="http://www.free-css.com/">Links</a></li>
<li><a href="http://www.free-css.com/">Download</a></li>
<li><a href="http://www.free-css.com/">Support</a></li>
<li><a href="http://www.free-css.com/">Contact</a></li>
</ul>
<div class="box">
<h2 style="margin-top:17px">Recent Entries</h2>
<ul>
<li><a href="http://www.free-css.com/">Recent Entries1</a> <i>01 Des 06</i></li>
<li><a href="http://www.free-css.com/">Recent Entries2</a> <i>01 Des 06</i></li>
<li><a href="http://www.free-css.com/">Recent Entries3</a> <i>01 Des 06</i></li>
<li><a href="http://www.free-css.com/">Recent Entries4</a> <i>01 Des 06</i></li>
<li><a href="http://www.free-css.com/">Recent Entries5</a> <i>01 Des 06</i></li>
</ul>
</div>
</div>
<div id="clear"></div>
</div>
<div id="footer">
<p>Copyright 2006 LoadFoO [V1]. Designed by <a href="http://loadfoo.org/">LoadFoO</a>. Valid <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> & <a href="http://validator.w3.org/check?uri=referer">XHTML</a></p>
</div>
</div>
</body>
</html>
Related examples in the same category