Behind her heart

Designer's Comments

Look carefully for specific instructions

Information on the layout. :)
This layout is a website template; it cannot be used for MySpace, Blogger, etc.
Please do not remove the credit. =)
You can download the whole package at my website, here. The download package contains all the images used in this layout and additional information. :)

And, don't forget to pay a visit to my little website, Heart Bliss

NOTE: This layout has valid coding and CSS and is coded in XHTML.

Layout Code

Copy and paste to Template HTML

Help

<!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" xml:lang="en" lang="en">
<head>
<title>Behind her heart</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

body {
background: url('http://cbimg6.com/layouts/09/10/35792ab.png');
font-family: "Trebuchet MS";
font-size: 11px;
line-height: 1.5em;
color: #dedede;
letter-spacing: 1px;
}

#container {
margin: 0 auto;
border: 4px solid #000;
width: 722px;
background-color: #545454;
}

#header {
width: 722px;
}

#content {
background-color: #545454;
padding: 4px;
width: 500px;
text-align: left;
margin-left: 0px;
margin-top: -8px;
}

#sidebar {
float: right;
width: 212px;
background-color: #545454; 
margin-right: 0px;
margin-top: -8px;
height: auto;
padding: 4px;
text-align: center;
}

#footer {
clear: both;
background-color: #000;
margin: 0px;
width: 722px;
height: 45px;
text-align: center;
}

#bar {
text-align: center;
margin: 8px;
padding: 12px;
margin-left: 0px;
background-color: #000;
margin-top: 0px;
width: 700px;
}

a.nav:link, a.nav:visited, a.nav:active {
text-decoration : none;
font-family : Tahoma;
font-size : 10px;
line-height : 12pt;
text-align : right;
color : #d1d1d1;
font-weight : bold;
background-color : #252525;
cursor : default;
display : block;
text-transform : uppercase;
padding : 5px;
border-right : 5px solid #c15876;
border-bottom : 1px dotted #7d7d7d;
}
a.nav:hover {
color : #ffffff;
background-color : #363636;
border-right : 5px solid #d58fb4;
border-bottom : 1px dotted #515151;
}

.site {
font-family: Georgia;
font-size: 22px;
color: #f672f4;
}

h1 {
margin-top: 5px;
text-align: left;
color: #fbaf5d;
font-family: Georgia;
font-size: 25px;
font-weight: normal;
padding: 5px;
font-style: italic;
border-bottom: 1px dotted #535152;
letter-spacing: 1px;
}

h1:first-letter {
text-align: left;
color: #e95c8b;
font-size: 25px;
font-style: normal;
font-weight: normal;
}

h2 {
font-weight: normal;
text-align: left;
color: #bb7de3;
font-family: Georgia;
font-size: 18px;
border-bottom: 1px dotted #8a8988;
padding-bottom: 2px;
margin-top: 7px;
margin-bottom: 7px;
}

a:link,a:visited,a:active {
text-decoration: none;
font-family: georgia;
cursor: default;
font-size: 11px;
color: #f36f6f;
font-weight: normal;
}

a:hover {
font-family: Georgia;
font-size: 11px;
text-decoration: none;
color: #f64646;
background-color: white;
padding: 1px;
}

b,strong {
font-family: "Trebuchet MS";
font-size: 11px;
font-weight: bold;
color: #f55082;
}

i,em {
font-family: georgia;
font-style: italic;
font-size: 11px;
color: #f5b550;
}

u {
font-family: verdana;
font-size: 11px;
border-bottom: 1px dotted #add568;
color: #45d7e0;
padding-bottom: 1px;
text-decoration: none;
}

blockquote {
width: 350px;
margin: 8px;
padding: 3px;
background: #fff;
border: 3px solid #413b31;
cursor: default;
color: #868883;
}

</style>
</head>
<body>
<div id="container">

<div id="header">
<img src="http://cbimg6.com/layouts/09/10/35792aa.jpg" border="0" alt=""  />

<h2>Navigation</h2>
<a href="linkhere" class="nav">Link 1</a>
<a href="linkhere" class="nav">Link 2</a>
<a href="linkhere" class="nav">Link 3</a>
<a href="linkhere" class="nav">Link 4</a>
<a href="linkhere" class="nav">Link 5</a>

<h2>Title</h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut
laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lo

<h2>Title</h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut
laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lo
</div>

<div id="content">
<h1>This is the main header</h1>
<b>Bold</b> <i>Italics</i> <u>Underline</u> <a href="">Link</a><br />
<blockquote>This is a blockquote</blockquote>
<p>This is a premade layout made by <a href="http://heartbliss.info">Priya</a> at <strong>heartbliss.info</strong>. This layout took me a long time to code because this layout is structured with DIVs, and this was the first time that I was using DIV tags <em>alone</em> for coding the whole layout. If you want to know how to code this type of layout, I have a tutorial on it, <a href="http://heartbliss.info/tuts/codingadivlayout.php">here</a>.The header image features Britney Spears, but there are other elements too, which add interest to the whole <u>"look"</u> of the layout. Images used in the header image are from <a href="http://sweetandtalented.com">Sweet And Talented</a>. I followed <a href="http://users.livejournal.com/_bitter_endings/13461.html">this</a> tutorial to create the header image.<br />
<br />
You may edit the coding or use it as the base for your layout; but credit is a <b>MUST</b>. That being said, the coding is currently valid (including the CSS); but I cannot guarantee vaild coding after you edit it.<br />
<br />
Please keep the credit intact and enjoy the layout!<br />
</p>
<h2>This is a subheader</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut
laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure
dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla
facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit
augue duis dolore te feugait nulla facilisi.
</p></div>

<div id="footer">
Layout designed and coded by <a href="http://heartbliss.info">Priya</a> | Background from <a href="http://ego-box.com">Ego Box</a><br />
Valid <a href="http://validator.w3.org/check?uri=referer">XHTML</a> & <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a><br />
Footer information here.
</div>

</div>
</div>
</body>
</html>