Gray classic

Layout Code

Copy and paste to Template HTML

<!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>Classic Gray</title>

body {
	background-color:#ffffff;
	background-image:url(http://cbimg6.com/layouts/10/08/36458aa.png);
	background-repeat:repeat-x;
}

#header {
	position:absolute;
	background-image:url(http://cbimg6.com/layouts/10/08/36458ab.png);
	background-repeat:no-repeat;
	width:642px;
	height:333px;
	top:0px;
	left:0px;
	z-index:1;
}
#SiteName {
	position:absolute;
	left:244px;
	top:50px;
	width:369px;
	height:36px;
	z-index:2;
	font-size:35px;
	overflow:hidden;
	color:#777d8f;
}
#TopNav {
	position:absolute;
	left:238px;
	top:7px;
	width:593px;
	height:43px;
	z-index:3;
	overflow:hidden;
}

h1 {
	color:#000000;
	font-size:20px;
	background-image:url(http://cbimg6.com/layouts/10/08/36458ac.png);
	background-repeat:repeat-x;
}

a.nav:active, a.nav:visited, a.nav:link {
    display:Inline-block;
	color:#000000;
    font-family:georgia;
	text-align: center;
	width:85px;
	height:25px;
    font-size:11px;
    font-weight:None;
    text-decoration:none;
    letter-spacing:1px;
	background-image:url(http://cbimg6.com/layouts/10/08/36458ad.png);
    line-height:14px;

}

a.nav:hover {
	display:Inline-block;
    color:#000000;
    font-family:georgia;
	text-align: center;
    font-size:12px;
	width:85px;
	height:25px;
    font-weight:normal;
    text-decoration: none;
    letter-spacing:1px;
	background-image:url(http://cbimg6.com/layouts/10/08/36458ae.png);
    line-height:14px;
}

a.link:active, a.link:visited, a.link:link {
    display:Inline-block;
	color:#32444d;
    font-family:georgia;
	text-align: center;
	width:85px;
	height:25px;
    font-size:11px;
    font-weight:None;
    text-decoration:none;
    letter-spacing:1px;
    line-height:14px;

}

a.link:hover {
	display:Inline-block;
    color:#5d6d76;
    font-family:georgia;
	text-align: center;
    font-size:12px;
	width:85px;
	height:25px;
    font-weight:normal;
    text-decoration: none;
    letter-spacing:1px;
    line-height:14px;
}
a.link2:active, a.link2:visited, a.link2:link {
    display:inline-block;
	color:#725d76;
    font-family:georgia;
	text-align: center;
	width:85px;
	height:25px;
    font-size:10px;
    font-weight:None;
    text-decoration:none;
    letter-spacing:1px;
    line-height:14px;

}

a.link2:hover {
	display:inline-block;
    color:#97829b;
    font-family:georgia;
	text-align: center;
    font-size:11px;
	width:85px;
	height:25px;
    font-weight:normal;
    text-decoration: none;
    letter-spacing:1px;
    line-height:14px;
}

#topcontent {
	position:absolute;
	left:250px;
	top:108px;
	width:707px;
	height:297px;
	z-index:4;
	background-image:url(http://cbimg6.com/layouts/10/08/36458af.png);
	background-repeat:no-repeat;
	overflow:hidden;
	color:#32444d;
}
#Leftnav {
	position:absolute;
	left:31px;
	top:229px;
	width:202px;
	height:177px;
	z-index:5;
	overflow:hidden;

}
#MainContent {
	position:absolute;
	left:253px;
	top:423px;
	width:706px;
	height:296px;
	z-index:6;
	color:#30424c;
}
#Bnav {
	position:absolute;
	left:37px;
	top:451px;
	width:129px;
	height:346px;
	z-index:7;
}

-->
</style>
</head>

<div id="header"></div>
<div id="SiteName">
Insert Title Here
</div>

<div id="TopNav">
<a href="../link" class="nav">Clear</a>
<a href="../link" class="nav">Visitor</a>
<a href="../link" class="nav">Sitely</a>
<a href="../link" class="nav">Extra</a>
<a href="../link" class="nav">Contact</a>
<a href="http://justleah.createblog.com" class="nav">Designer</a>

</div>

<div id="topcontent">

  Hello there, my name is ______, and this is my website. 
  Introduction to the site.. 
  This is just the top area. 
  <p>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  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
  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  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
  <p>&nbsp;</p>
</div>

<div id="Leftnav">

<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>
<a href="../link" class="link">Affiliate</a>

</div>
<div id="MainContent">
<h1>Header sample</h1>
 <p>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  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
  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  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
  
  <h1>Others</h1>
   <p>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  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
  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  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
</div>

<div id="Bnav">
<ul>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
<li type="circle"><a href="../link" class="link2">Linkage</a>
</ul>
</div>

Layout Comments

Showing latest 6 of 6 comments

:) this is nice

By Cedrine on Dec 29, 2011 2:58 pm

:-)nice

By LuahanCinta2011 on Feb 13, 2011 11:13 pm

good

By romb0604 on Aug 13, 2010 4:51 am

This is beautiful!

By schizo on Aug 10, 2010 12:24 pm

I like this one!!!!
Simple,but cute :D

By Snaily on Aug 2, 2010 9:24 pm

Layout Details

Designer	JustLeah
Submitted on	Jul 27, 2010
Page views	6,963
Favorites	20
Comments	6
Reviewer	jiyong
Approved on	Aug 2, 2010

Gray classic

Layout Code

Layout Comments

Layout Details

Layout Colors

Layout Tags

Layout Tools

Layout Affiliates