cssmajesty
<!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'>
/* CSS RESET */
html {
color:#000;
background:#FFF;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset, img {
border:0;
}
address, caption, cite, code, dfn, em, strong, th, var {
font-style:normal;
font-weight:normal;
}
li {
list-style:none;
}
caption, th {
text-align:left;
}
h1, h2, h3, h4, h5, h6 {
font-size:100%;
font-weight:normal;
}
q:before, q:after {
content:'';
}
abbr, acronym {
border:0;
font-variant:normal;
}
sup {
vertical-align:text-top;
}
sub {
vertical-align:text-bottom;
}
input, textarea, select {
font-family:inherit;
font-size:inherit;
font-weight:inherit;
}
legend {
color:#000;
}
body {
font:13px/1.231 arial, helvetica, clean, sans-serif;
}
table {
font-size:inherit;
font-size:100%;
}
pre, code, kbd, samp, tt {
font-family:monospace;
line-height:100%;
}
/* CSS RESET */
body {
text-align:center;
background:url(cssmajesty-images/bgg.png) repeat-x top
}
a {
text-decoration:none;
}
a:hover {
text-decoration: underline;
}
#wrap {
width:769px;
text-align:left;
margin:0 auto;
}
.fl {
float:left
}
.fr {
float:right
}
.clearfix {
clear:both
}
/* header */
#header {
background:#000 url(cssmajesty-images/hd.png) no-repeat bottom;
height:183px;
width:769px;
position:relative
}
#logo {
position:absolute;
top:50px;
left:30px
}
#logo div {
position: relative;
top:10px;
left:30px
}
#logo h1 {
font-size:50px;
font-weight:700;
color:#1C3C9E
}
#logo div {
font-weight:700
}
#header li {
float:left;
padding:0px 23px;
line-height:44px
}
#header li.last {
padding:0px 0 0 23px;
}
#header li a {
color:#2eb3ea
}
#header ul {
background:url(cssmajesty-images/nav.gif);
position:absolute;
right:10px;
top:50px;
width:304px;
height:44px;
}
/* content */
#content {
background:url(cssmajesty-images/bg.png);
padding:15px 0 15px 15px;
}
#ct_bg {
background:url(cssmajesty-images/b.gif) repeat-y
}
.main {
width:380px;
margin:0 0 0 20px
}
.main h2 {
font-size:36px;
margin-bottom:20px;
}
.side {
width:280px;
margin-right:20px
}
.si {
width:200px;
margin:0 auto
}
.si img {
margin:10px 0
}
.col {
width:170px;
margin:50px 0 0 0
}
.col h2 {
color:#26ade4;
font-size:18px
}
.t { background:url(cssmajesty-images/t.gif) no-repeat; height:38px}
/* footer */
#footer {
}
</style>
</head>
<body>
<div id="wrap">
<div id="header">
<div id="logo">
<div>its royalty, dummy</div>
<h1>cssmajesty</h1>
</div>
<ul id="nav">
<li ><a href="#">home</a></li>
<li><a href="#">news</a></li>
<li><a href="#">about</a></li>
<li class="last"><a href="#">forum</a></li>
</ul>
</div>
<!-- /header -->
<div id="content"><div class="t"></div>
<div id="ct_bg">
<div class="side fr">
<div class="si"><img src="cssmajesty-images/1.jpg" alt="" /> <img src="cssmajesty-images/2.jpg" alt="" /><img src="cssmajesty-images/3.jpg" alt="" />
<div id="footer">
<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>
</div>
</div>
<div class="main">
<h2>Free CSS Templates</h2>
<p> Cssmajesty is a CSS template that is free and fully standards compliant. <a href="http://www.free-css-templates.com/">Free CSS Templates</a> designed this template. </p>
<p> This template is allowed for all uses, including commercial use, as it is released under the Creative Commons Attributions 2.5 license. The only stipulation to the use of this free template is that the links appearing in the footer remain intact. Beyond that, simply enjoy and have fun with it!</p>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse pretium commodo lorem. Cras gravida, mauris pellentesque aliquet posuere, sapien eros interdum orci, et sagittis sem dolor eu est. Curabitur et urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Mauris laoreet egestas tortor. Donec sit amet ante sit amet velit bibendum interdum. Curabitur vitae enim. Curabitur sapien. Nullam sit amet urna ac velit tincidunt dapibus. Maecenas iaculis, orci eu hendrerit vehicula, turpis nunc vestibulum velit, quis tristique pede mauris eu arcu. Morbi fringilla, orci malesuada lobortis sollicitudin, magna odio interdum sem, sit amet ultricies metus dolor non nunc. In odio tortor, suscipit sit amet, placerat vel, vulputate nec, turpis. Morbi dictum nibh in est. Proin luctus malesuada odio. Praesent ut ipsum a nibh lobortis semper. </p>
<div class="col fr">
<h2>New Updates</h2>
<p> In eget nisl bibendum metus scelerisque tempor. Integer eget sem. Nam et orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam ipsum ipsum, varius non, nonummy at, pulvinar eu, nunc. </p>
</div>
<div class="col first">
<h2>Latest Sites </h2>
<ul>
<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="#">Virginia looked one</a></li>
<li><a href="#">Latin professor </a></li>
<li><a href="#">Hampden Sydney </a></li>
</ul>
</div>
<div class=" clearfix"> </div>
</div>
</div>
<img src="cssmajesty-images/f.gif" alt="" /> </div>
<!-- /content -->
<!-- /footer -->
</div>
</body>
</html>
Related examples in the same category