Layout CSS
<!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>The Red Velvet</title>
<style type="text/css">
<!--
body {
background-color:#000000;
background-image:url(http://cbimg6.com/layouts/10/08/36470ac.png);
background-repeat: repeat-x;
}
h1 {
color:#cccccc;
text-align:center;
font-size:18px;
text-transform: uppercase;
width:486px;
height:20px;
border-top-color:#3c0914;
border-top-width:1px;
border-top-style:solid;
border-bottom-color:#3c0914;
border-bottom-width:1px;
border-bottom-style:solid;
border-left-color:#3c0914;
border-left-width:1px;
border-left-style:solid;
border-right-color:#3c0914;
border-right-width:1px;
border-right-style:solid;
}
h2 {
background-image:url(http://cbimg6.com/layouts/10/08/36470ad.png);
width:169px;
height:30px;
text-transform:capitalize;
font-family: times new roman;
color:#cccccc;
font-size:16px;
text-align:center;
}
#background {
position:absolute;
left:0px;
top:0px;
width:399px;
height:271px;
z-index:2;
background-image:url(http://cbimg6.com/layouts/10/08/36470ae.png);
background-repeat:no-repeat;
}
#content {
position: absolute;
left:407px;
top:132px;
width:486px;
height:731px;
z-index:1;
font-size:13px;
color:#c1c1c1;
padding:5px;
}
#SiteName {
position:absolute;
left:272px;
top:47px;
width:597px;
height:46px;
z-index:3;
text-transform:uppercase;
font-size:36px;
font-family: "Palatino Linotype";
color:#000000;
overflow:hidden;
}
#TopNav {
position:absolute;
left:264px;
top:91px;
width:596px;
height:35px;
z-index:4;
}
a.nav:active, a.nav:visited, a.nav:link {
display:Inline-block;
color:#000000;
font-family:georgia;
text-align: center;
height:30px;
width:85px;
font-size:12px;
font-weight:None;
text-decoration:none;
letter-spacing:1px;
line-height:14px;
text-transform:uppercase;
}
a.nav:hover {
display:Inline-block;
color:#000000;
font-family:georgia;
text-align: center;
width:85px;
font-size:13px;
height:30px;
font-weight:normal;
text-decoration: none;
letter-spacing:1px;
line-height:14px;
text-transform:uppercase;
background-image:url(http://cbimg6.com/layouts/10/08/36470af.png);
}
#leftnav {
position:absolute;
left:222px;
top:222px;
width:169px;
height:541px;
z-index:5;
color:#c1c1c1;
font-size:12px;
}
img {
padding-right:5px;
}
a.link:active, a.link:visited, a.link:link {
display:block;
color:#cccccc;
font-family:georgia;
text-align:left;
font-size:11px;
width:163px;
font-weight:None;
text-decoration:none;
letter-spacing:1px;
line-height:14px;
background-color:#350707;
border-bottom-color:#000000;
border-bottom-width:1px;
border-bottom-style:solid;
}
a.link:hover {
display:block;
color:#cccccc;
font-family:georgia;
text-align: left;
font-size:12px;
width:163px;
font-weight:normal;
text-decoration: none;
letter-spacing:1px;
line-height:14px;
background-color:#3c0808;
border-bottom-color:#000000;
border-bottom-width:1px;
border-bottom-style:solid;
border-left-color:#3c0914;
border-left-width:2px;
border-left-style:solid;
border-right-color:#3c0914;
border-right-width:2px;
border-right-style:solid;
}
-->
</style>
</head>
<div id="background"></div>
<div id="content">
<h1>Header sample</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, lib</p>
<p>ero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, comm</p>
<h1>Lorem Ipsum</h1>
<p>odo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacuseo pede, rhoncus venenatis, tristique in, vet, nibh. Donec nec libero.</p>
<p>odo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacuseo pede, rhoncus venenatis, tristique in, vet, nibh. Donec nec libero.</p>
<p>odo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacuseo pede, rhoncus venenatis, tristique in, vet, nibh. Donec nec libero.</p>
<p></p>
</div>
<div id="SiteName">The Red Velvet</div>
<div id="TopNav">
<a href="../link" class="nav">Home</a>
<a href="../link" class="nav">Site</a>
<a href="../link" class="nav">Content</a>
<a href="../link" class="nav">About</a>
<a href="../link" class="nav">Contact</a>
<a href="http://justleah.createblog.com" class="nav">Designer</a>
</div>
<div id="leftnav">
<h2>About..</h2>
<img src="http://cbimg6.com/layouts/10/08/36470aa.png" width="100" height="100" align="left"/>
iLorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus,
<img src="http://cbimg6.com/layouts/10/08/36470ab.png" width="169" height="22" />
<h2>Navigate</h2>
<a href="../link" class="link">Clear</a>
<a href="../link" class="link">Sitely</a>
<a href="../link" class="link">visitor</a>
<a href="../link" class="link">Friends</a>
<a href="../link" class="link">Interact</a>
<a href="http://justleah.createblog.com" class="link">Designer</a>
<img src="http://cbimg6.com/layouts/10/08/36470ab.png" width="169" height="22" />
<h2>Affiliates</h2>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<img src="http://cbimg6.com/layouts/10/08/36470ab.png" width="169" height="22" />
</div>
Comments (0)
No comments yet. Be the first!
Log in to leave a comment.