I am!

Designer's Comments

Look carefully for specific instructions

hmm...I love this horizontal Layouts too much I think .. -_-
Took my a whilt to finish this, I experimented with the coding.
I hope you like it! ^.-

best view with Mozilla Firefox

(please leave a comment, if you use it ^^)

　／l、
ﾞ（ﾟ､｡７
　l、ﾞ ~ヽ
　じしf_, )ノ

Layout Code

Copy and paste to Template HTML

Help

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>Iam!</title>
  <meta http-equiv="Content-Type"
 content="text/html; charset=iso-8859-1">
  <style type="text/css">body { background-color: #edefe2;
margin:0px;
font-family: arial;
font-size: 10px;
line-height: 11px;
color: #e1c0b0;
right: 0px;
text-decoration: none;
}
#parent{
background:transparent; width:1600px;
float: left;
}
#parent-navi{
background:transparent; height: 25px;
width:1600px;
float: left;
}
#parent-banner{
background-image: url(http://cbimg6.com/layouts/09/07/35084aa.jpg);
width:1600px;
height: 83px;
float: left;
}
#parent-footer{
background-image: url(http://cbimg6.com/layouts/09/07/35084ab.jpg);
width:1600px;
height: 88px;
float: left;
}
#parent-content{
background-color: transparent;
width:1600px;
height: 249px;
float: left;
}
#navi-pic {
height: 25px;
width: 294px;
background-image: url(http://cbimg6.com/layouts/09/07/35084ac.jpg);
float: left;
margin: 0px;
}
#banner-pic {
height: 83px;
width: 294px;
background-image: url(http://cbimg6.com/layouts/09/07/35084ad.jpg);
float: left;
margin: 0px;
}
#content-pic {
height: 249px;
width:294px;
float: left;
background-image: url(http://cbimg6.com/layouts/09/07/35084ae.jpg);
margin: 0px;
}
#footer-pic {
height: 88px;
width:294px;
float: left;
background-image: url(http://cbimg6.com/layouts/09/07/35084af.jpg);
margin: 0px;
}
h4 { font-family: arial;
color: #000;
letter-spacing: 2;
line-height: 3px;
font-size: 10px;
text-align: left;
text-transform: uppercase;
letter-spacing: none;
background-color: #fff;
border-top: 3px solid #fca00f;
}
h3 { font-family: arial ;
color: #1c1e27;
letter-spacing: none;
line-height: 20px;
font-size: 12px;
float: right;
margin: 5px 2px 0px 0px;
text-align: left;
font-weight: bold;
border-left: 5px solid #fcc900;
letter-spacing: none;
background-color: #55575f;
text-transform: uppercase;
padding: 5px 2px 5px 2px;
}
h2 { font-family: georgia;
color: #f05f4e;
line-height: 15px;
text-transform: uppercase;
font-size: 12px;
text-align: left;
letter-spacing: none;
background-color: transparent;
}
h1 { font-family: georgia;
color: #1d0a5b;
letter-spacing: 2;
line-height: 17px;
font-size: 12px;
text-align: left;
letter-spacing: none;
background-color: #fff;
border-left: 15px double #1c1e27;
border-right: 15px double #1c1e27;
padding: 0px 2px 0px 2px;
}
ul { font-family: arial;
font-size: 10px;line-height: 11px;
color: #e1c0b0;
background-color: transparent;
}
#space-titel {
height: 88px;
color: #1c1e27;
background-color: transparent;
font-size:15px;
font-family:georgia;
font-style: italic;
font-weight: bold;
overflow: auto;
float: left;
padding: 10px 0px 0px 15px;
line-height: 15px;
text-align: center;
}
#box{
background-color: #e5e7d9;
width:171px;
height: 245px;
float: left;
margin: 0px 0px 0px 5px;
color: #1c1e27;
padding: 2px 2px 2px 2px;
font-size:8px;
font-family:arial;
overflow: auto;
text-transform: uppercase;
line-height: 13px;
text-align: left;
}
#content {
height: 245px;
width: 500px;
color: #fff;
background-color:#1c1e27;
margin: 0px;
padding: 2px 5px 2px 5px;
font-size:11px;
font-family:arial;
overflow: auto;
float: left;
line-height: justify;
text-align: left;
}
#content a, #content a:link, #content a:active, #content a:visited { color:#bd2b5b;
font-size:9px;
font-family:georgia;
line-height: 12px;
text-align: left;
text-transform: lowercase;
text-decoration: none;
background-color: transparent;
font-style: italic;
cursor: help;
}
#content a:hover, #content a:focus {
color:#fff;
background-color: transparent;
cursor: default;
text-decoration: none;
font-style: normal;
cursor: help;
}
#content2 {
height: 349px;
width: 340px;
color: #fff;
background-color: transparent;
margin: 0px 0px 0px 5px;
padding: 2px 5px 2px 5px;
font-size:11px;
font-family:georgia;
overflow: auto;
float: left;
line-height: 15px;
text-align: left;
border-left: 1px dashed #e9e8e6;
border-right: 1px dashed #e9e8e6;
}
#content2 a, #content2 a:link, #content2 a:active, #content2 a:visited { color:#bd2b5b;
font-size:9px;
font-family:georgia;
line-height: 12px;
text-align: left;
text-transform: lowercase;
text-decoration: none;
background-color: transparent;
font-style: italic;
cursor: help;
}
#content2 a:hover, #content2 a:focus {
color:#fff;
background-color: transparent;
cursor: default;
text-decoration: none;
font-style: normal;
cursor: help;
}
#navi {
height: 25px;
background-color: transparent;
float: left;
margin: 2px;
}
#navi a:link, #navi a:active, #navi a:visited { color:#1c1e27;
font-size:9px;
font-family:arial;
line-height: 25px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
background-color: transparent;
cursor: help;
overflow: auto;
padding: 8px 2px 8px 2px;
margin: 0px 5px 0px 5px;
}
#navi a:hover, #navi a:focus {
color:#fcd700;
background-color: #1d1e27;
cursor: default;
text-decoration: none;
cursor: help;
padding: 8px 2px 8px 2px;
}
::-moz-selection {
background:#edefe2;
color:#1d1e27;
}
textarea { border: 1px solid #edefe2;
background-color: transparent;
width: 260px;
height: 160px;
font-family: arial;
font-size: 10px;
line-height: 11px;
color: #edefe2;
}
input { border: 1px solid #fff;
background-color: #fff;
font-size: 10px;
line-height: 11px;
font-family: arial;
color: #0c1054;
}
b, strong { font-family: arial black;
font-size: 10px;line-height: 12px;
color: #eff9f8;
font-weight: bold;
}
i, em { font-family: arial;
font-size: 9px;line-height: 9px;
color: #fff;
font-style: italic;
}
u { font-family: arial;
font-size: 9px;line-height: 9px;
color: #fff;
text-decoration: none;
border-bottom: 1px dashed #fcd800;
}
s, stroke { font-family: arial;
font-size: 9px;line-height: 9px;
color: #fcd800;
text-decoration: line-through;
}
m { font-family: arial;
font-size: 9px;
line-height: 13px;
color: #000;
text-decoration: none;
background-color: #eff9f8;
margin: 0px 2px 0px 2px;
padding: 0px 3px 0px 3px;
}
blockquote {
margin: 15px;
padding: 15px;
background-color: #75767d;
font-size: 10px;
line-height: 15px;
color: #fff;
text-align: left;
border-left: 10px double #fff;
}
blockquote:before { font-family: georgia;
color: #fcc900;
content: open-quote;
font-weight: bold;
font-size: 20pt;
padding: 0px 2px 0px 0px;
}
  </style>
</head>
<body>
<div id="parent">
<div id="parent-navi">
<div id="navi-pic">.</div>
<div id="navi"><a href="">Home</a><a
 href="">About</a><a href="">Gallery</a><a
 href="">Videos</a><a href="">Links</a><a
 href="">Guestbook</a><a href="">Contact</a><a
 href="">Credits</a><a href="">...and so
on...</a>
</div>
</div>
<div id="parent-banner">
<div id="banner-pic">.</div>
</div>
<div id="parent-content">
<div id="content-pic">.</div>
<div id="content">
<h1>I am!</h1>
I am! yet what I am none cares or knows,Into the nothingness of scorn
and noise,<br>
My friends forsake me like a memory lost;<br>
I am the self-consumer of my woes,<br>
They rise and vanish in oblivious host,<br>
Like shades in love and death's oblivion lost;<br>
And yet I am! and live
with shadows tost<br>
<br>
<h3>Basic Codes</h3>
<blockquote><b>BOLD</b> . <i>ITALIC</i>
. <s>STROKE </s> . <u>UNDERLINE</u> . <m>MARKED</m></blockquote>
</div>
<div id="box">
<h4>Fill me!</h4>
[...]
Into the living sea of waking dreams,<br>
Where there is neither sense of life nor joys,<br>
But the vast shipwreck of my life's esteems;<br>
And e'en the dearest—that I loved the best<br>
Are strange—nay, rather stranger than the rest[...]
</div>
</div>
<div id="parent-footer">
<div id="footer-pic">.</div>
<div id="space-titel">[ Here You give your Site a
Title (^_^)v ]</div>
</div>
</div>
</body>
</html>