Beyond Imagination

Designer's Comments

Look carefully for specific instructions

Best Viewed in IE, not so pretty on other servers.

Obviously, no stealing :)

Created by Mizuro at Intertwined Designs.

Layout Code

Copy and paste to Template HTML

Help

<title>Beyond Imagination
</title>
<style type="text/css">

body{
background:#e6e6e6 url('http://cbimg6.com/layouts/09/06/34971ab.jpg') repeat-y;
background-color: #e8e2d0;
}

font,td,p,xmp,a
{color: #c39fa5;
margin-top: 0px;
font: 12px century gothic;
font-weight: normal;
text-align: left;}

#background{
background:url('http://cbimg6.com/layouts/09/06/34971ac.jpg');
repeat: none;
position:absolute;
left:0px;top:-40px;width:651px;height:432px;
z-index:-1;}

#content{
position: absolute;
width:377px;
left: 10px;
top:300px;}

#title{
position: absolute;
top: 250px;
left: 90px;
font: 30px new times romans;
color: fd9baa;}

h1{
font:23px georgia;
color: #c0b5a0;
text-align: center;
text-transform: lowercase;
font-style: italic;
letter-spacing: 2px;
margin-bottom: 0px;}

h2{
font: 12px times new romans;
color: #dfa0ab;
text-align: center;
font-style:italic;
margin-top: 0px;
letter-spacing: 3px;
background-color: #ffeedf}

#navigation { position: absolute; left: 410; top: 300;}

#navigation a:link, navigation a:active, #navigation a:visited{
font: 12px century gothic;
background-color: transparent;
border-bottom: 1px dashed #dfc7ae;
border-right: 6px solid #e3b6a1;
color: #f4b0af;;
letter-spacing: 3px;
text-align: left;
padding-left: 5px;
width: 175px;}

#navigation a:hover{
font: 12px century gothic;
background-color: transparent;
border-bottom: 1px dashed #dfc7ae;
border-right: 6px solid #885655;
color: #f4b0af;
letter-spacing: 3px;
text-align: center;
padding-left: 5px;
width: 175px;}

h3{
font: 15px georgia;
color: a58887;
font-style: italic;
letter-spacing: 2px;
text-align: center;
margin-bottom: 0px;}

b, strong {
font-weight:bold; 
text-transform: none; 
font-family: century gothic;
color: #fb0c67;
}
 
u, underline { 
font-weight: none; 
text-transform:none; 
font-family: century gothic;
color: #fca7e8; 
text-decoration: underline; 
}
 
i, italics {
text-transform: none; 
font-family: century gothic;
color: #f8be8e;
font-style: italics;
}

s, strikethrough{
text-transform: none; 
font-family: century gothic;
color: #feab7f;
font-style: strikethrough;
}

a:link, a:active, a:visited{
font: trebuchet ms;
font-size: 9px:
font-color: #c2b4c29;
background-color: #ffffff;
text-transform: lowercase;
font-style: italic;
letter-spacing: 3px;
}

a:hover{
font: trebuchet ms;
font-size: 9px:
font-color: #c2b4c2;
background-color: transparent;
text-transform: lowercase;
font-style: italic;
letter-spacing; 3px;
}

blockquote{
background-color: #ffffff;
color: #c0b5a0;
font: 10px century gothic;
border-bottom: 5px solid #ffeedf;

</style>
</head>

<body>

<div id="title">
website [dot] com
</div>

<div id="navigation">
<h3>Link Title</h3>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<h3>Link Title</h3>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<h3>Link Title</h3>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<a href="LINK HERE">LINK HERE</a><br>
<h3>Credits</h3>
<a href="http://intertwined.reminiscent-designs.net">Intertwined</a><br>
</div>

<div id="content">
<h1>you faded away</h1>
<h2>our beautiful memories</h2>
<div style="float: right;"><img src="http://cbimg6.com/layouts/09/06/34971aa.jpg"></div>
<p>A mention of thanks to Everina who tried to help me code this. Man was this a pain in the ass. I've been coding for three hours straight which is kind of sad and I'm still not very pleased with the results but what can a girl do?
I'm pretty sure this only works in IE, most of mine always work in IE and in firefox, most likely not. Remember to keep credits intact, that would be really really nice. <br><br>
Mizuro at <a href="http://intertwined.reminiscent-designs.net">Intertwined Designs</a>
</p>

<h1>how to use</h1>
<h2>you better read this</h2>
<p>To use this layout you must know that it only does links on the headers and you must be somewhat familiar with CSS. I mean even if you're not it's okay, you would just need to learn how to do this. It's very easy.<br><br>
1. Unzip the layout.<br>
2. Edit index.html to your likings.<br>
3. Upload all files into one place. <br>
4. Ask questions if you want to and please keep the credits intact.</p>

<h1>you might want to know</h1>
<h2>just some extras</h2>
<p><b>bold</b><i>italic</i><u>underline</u><s>strikethrough</s><a href="XXXX">link here</a><br><br>
<blockquote>"Does thee know'st my love?"</blockquote></p>
<p>Created by Mizuro @ <a href="http://intertwined.reminiscent-designs.net">Intertwined Designs</a><br>
Please keep the credits intact. 
</p>
</div>

</body>
</html>

Layout Comments

Showing latest 10 of 11 comments

Oh this is such a cute layout for Yuuki I love it! I just don't have a profile to use it on lol. I did my own. But could you make one like this for...Kaname?

By ShizukaHio on Aug 23, 2009 3:32 pm