H.O.P.E

Website Templates / 2 Columns

Designer's Comments

Look carefully for specific instructions

Based on a poem

Layout Code

Copy and paste to Template HTML

Help

<title>H.O.P.E.//YOUR TITLE</title>
<STYLE TYPE="text/css">
body , h6 , li {
background-image: url(http://layouts.cbimg9.com/30/14869d.jpg); 
background-attachment: scroll; 
background-position: left center;
background-repeat: repeat-y;   
color: #FFFFFF; 
font-size: 12px; 
font-family: Arial;
background-color: #FFFFFF; 
scrollbar-face-color: #FFFFFF; 
scrollbar-arrow-color: #FABFB6; 
scrollbar-track-color: #FFFFFF; 
scrollbar-shadow-color: #FABFB6; 
scrollbar-darkshadow-color: #FFFFFF; 
scrollbar-3dlight-color: #FABFB6; 
scrollbar-highlight-color: #FFFFFF;
}
tr , td , {
background-color: #1;
text-align: center; 
}
input , textarea , select {
background-image: url(http://layouts.cbimg9.com/30/14869e.jpg); 
background-color : #1; 
font-size: 12px; 
font-weight: none; 
font-family: Arial;
color: #FFFFFF; 
border: 1px solid #FFFFFF; 
scrollbar-face-color: #FABFB6; 
scrollbar-arrow-color: #FFFFFF; 
scrollbar-track-color: #FABFB6; 
scrollbar-shadow-color: #FFFFFF; 
scrollbar-darkshadow-color: #FABFB6; 
scrollbar-3dlight-color: #FFFFFF; 
scrollbar-highlight-color: #FABFB6;
} 
i {
font-size: 12px; 
font-family: Arial;
color: #FFFFFF;
} 
b {
ffont-size: 12px; 
font-family: Arial;
color: #FFFFFF;
font-weight: bolder; 
}
u {
font-size: 12px; 
font-family: Arial;
color: #FFFFFF;
} 
s {
font-size: 12px; 
font-family: Arial;
color: #FFFFFF;
} 
A:link {
color: #FFFFFF; 
border-bottom: solid 0px #FFFFFF; 
text-decoration: none; 
font-size: 12px; 
font-weight: bold;
font-family: Arial;
cursor:crosshair; 
height: 1px; 
} 
A:visited {
color: #FFFFFF; 
border-bottom: solid 0px #FFFFFF; 
text-decoration: none; 
font-size: 12px; 
font-weight: bold;
font-family: Arial;
cursor:crosshair; 
} 
A:active {
color: #FFFFFF; 
border-bottom: solid 0px #FFFFFF; 
text-decoration: none; 
font-size: 12px; 
font-weight: bold;
font-family: Arial;
cursor:crosshair; 
} 
A:hover {
color: #C92F17; 
border-bottom: solid 0px #C92F17; 
text-decoration: none; 
background-color #1; 
font-size: 12px; 
letter-spacing: 1px;
font-weight: bold;
font-family: Arial;
cursor: crosshair; 
}
a img {
border: none; 
}
p { 
font-family: Arial;
color: #FFFFFF; 
}

a.menu, a.menu:active, a.menu:link, a.menu:visited {
display: block; 
border-bottom: 0px dotted #FFFFFF;
border-top: 0px dotted #FFFFFF;
border-left: 0px dotted #FFFFFF;
border-right: 0px dotted #FFFFFF;
font-size: 12px; 
font-family: Arial;
color: #FFFFFF; 
font-weight: none; 
background-color: #1; 
text-align: left; 
letter-spacing: 0px; 
height: 20px; 
} 
a.menu:hover {
display: block; 
border-bottom: 0px dotted #FFFFFF;
border-top: 0px dotted #FFFFFF;
border-left: 0px dotted #FFFFFF;
border-right: 0px dotted #FFFFFF;
font-size: 12px; 
font-family: Arial;
color: #FFFFFF; 
background-color: #1; 
font-weight: none; 
text-align: center; 
letter-spacing: 1px;
height: 20px;
}
h1 {
font-size: 17px; 
font-family: Arial;
border-bottom: 1px solid ;
border-top: 1px solid;
border-left: none;
border-right: none;
text-transform: none;
text-align: center;
color: #FFFFFF; 
cursor:default;
}
.title{
color: #FFFFFF;
letter-spacing:2px;
border: 1px solid #FFFFFF;
border-bottom: 1px solid ;
border-top: 1px solid;
border-left: 1px solid;
border-right: 1px solid;
text-align: center;
font-weight: bold; 
font-size:12px;
font-family: Arial;
}
div.box {
border:0px solid #F89D8E;
width:100%; 
padding:5px;
background:#1;
}
</style>
</head>
<body>

<IMG SRC="http://layouts.cbimg9.com/30/14869c.jpg" style="position:absolute; left: 0px; top: 0px;" WIDTH=600 HEIGHT=500 BORDER=0 ALT="" USEMAP="#images01_Map">
<MAP NAME="images01_Map">
<AREA SHAPE="rect" ALT="The Gardener" COORDS="49,3,156,14" HREF="http://www.geocities.com/angelic_eyez102/">
</MAP>

<p class="title">About Moi</p>
<b>Name:</b>Bobo
<br />
<b>Age:</b>743 years old
<br />
<b>Intersts:</b>Licking lolipos without my dentures
<br />
<b>Sex:</b>I've forgotten
<br />
<br />
<p class="title">Menue</p>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<br /><br />
<p class="title">Menue</p>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<a href="http://www.createblog.com/" class="menu">Link</a>
<br /><br />

<p class="title">Credits</p>
<b><u>Gardener:
<a href="http://www.geocities.com/angelic_eyez102/">angel_eyez102</a>
<br />
Brushes: 
<a href="http://spy-glass.net/brushes/">spy-glass.net</a>
<br />
D/L: <a href="http://www.createblog.com/">createblog.com</a>
<br />
Poem: </u></b>"With A Flower by <a href="http://www.poetseers.org/early_american_poets/emily_dickinson">Emily Dickinson</a>
<br /></center>

</div>

<div class="box" style="position:absolute; left:35; top: 355px; width:345;">
<h1>Title number 1</h1>

<br /> So you can fill this all you want...<br />
This is how the text will look like <br /><br />
<b>bold text</b><br />
<i>italic text</i><br />
<a href="http://www.createblog.com/">Link normal</a> (not in a menue)<br />
<u>underlined text</u><br />
<s>stricken text</s>
<br />
<textarea>textarea textarea textarea textarea textarea  textarea textarea textarea</textarea>
<br />
<br />

<h1>Title number 2</h1>

Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />

<h1>Title number 3</h1>

Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />
Blah blah blah<br />

</div>

</body>
</html>

Layout Comments

Showing latest 9 of 9 comments

This is very cute.

By TinyIrish on Feb 1, 2011 9:05 am

pree-tuh

By sweet-kiss on May 3, 2008 3:49 am

I think it would be much better if only the links and/or headers were white; another colour, perhaps brown, dark grey or black would be best for the text?

Other than that, it's fantastic - I'm in love with the delicate beauty of this layout. Keep it up!

By sarahwynne on Jun 7, 2007 1:09 pm

exquisite layout i love the colors

By IVIike on Jan 5, 2007 10:59 pm

its light and beautiful

By hypnotique on Nov 26, 2006 4:42 pm

imma lovin` it! itz adorable!

By kaykaylicious on Nov 23, 2006 4:48 pm

This is way pretty. If only it was for Xanga too; I'd definitely use it. Such pretty colors and image.

By tokyo-rose on Oct 12, 2006 6:36 pm

luvs' it! :)

By Trinie on Oct 9, 2006 8:22 pm

Awww, it's adorable! I love it very much.I like the colors mainly, but the girl brings it all together. Good job!

By Fragil_BlackRose on Oct 9, 2006 8:19 pm

Layout Details

Designer	empyrean102
Submitted on	Oct 9, 2006
Page views	16,421
Favorites	29
Comments	9

H.O.P.E

Designer's Comments

Layout Code

Layout Comments

Layout Details

Layout Tags

Layout Tools

Layout Affiliates