Blarg.

Designer's Comments

Look carefully for specific instructions

These instructions are on the layout preview, but I might as well put them here too.

You can easily change the colors in this layout.. The header, footer, and text colors can all by changed through the coding. The main columns are created with an image, so you will need to copy this image into your image editting program (MS Paint works just fine) and fill in the green and white parts with the colors of your choice. Then reupload the image and plug it back into the code.

Remember to exercise caution when editting the stylesheet. If you're not experienced with CSS or HTML, something can go haywire. The image portion of this layout may be particularly tough for inexperienced users. Don't hesitate to contact me if you run into a bit of trouble with this layout. I'd be more than happy to help. :)

Visit my website to see more.

Layout Code

Copy and paste to Template HTML

Help

<html>
<head>
<title>Site Title Here;</title>
<style type="text/css">
body{
background-color:#5A6156;
font-family:"lucida sans unicode";
font-size:11px;
line-height:17px;
text-align:justify;
}

#container{
width:650px;
position:absolute;
left:50%;
margin-left:-325px;
top:100px;
background-image:url(http://cbimg6.com/layouts/09/12/36055aa.gif);
background-repeat:repeat;
background-color:transparent;
}

.banner{
background-color:#DDC568;
height:100px;
margin-top:-17px;
_margin-top:0px;
margin-bottom:0px;
margin-left:0px;
width:413px;
}

.main{
background-color:transparent;
padding:15px;
width:380px;
_width:410px;
}

.sidebar{
float:left;
width:207px;
_width:237px;
background-color:transparent;
padding:15px;
color:#ffffff;
}

#right{
float:right;
width:413px;
background-color:transparent;
}

.footer{
width:630px;
_width:650px;
background-color:#c5b583;
repeat:no-repeat;
text-align:center;
padding:10px;
border:none;
color:#ffffff;
clear:both;
}

a.navigation, a.navigation:active, a.navigation:visited, a.navigation:link{
display:block;
width:100%;
color:#ddc568;
text-decoration:none;
font-family:"lucida sans unicode";
font-size:12px;
}

a.navigation:hover{
display:block;
width:100%;
color:#ffffff;
text-decoration:none;
font-family:"lucida sans unicode";
font-size:12px;
}

a, a:active, a:visited, a:link{
color:#5a6156;
text-decoration:none;
}

a:hover{
color:#353a32;
text-decoration:none;
}

b{
color:#ddc568;
text-decoration:none;
font-size:11px;
text-transform:uppercase;
}

i{
color:#999960;
}

u{
border-bottom:1px dotted #999960;
text-decoration:none;
}

h1{
font-family:"lucida sans unicode";
font-size:16px;
text-align:left;
font-weight:normal;
letter-spacing:0px;
color:#5a6156;
margin-top:10px;
margin-bottom:10px;
}

h2{
font-family:"lucida sans unicode";
font-size:20px;
text-align:center;
font-weight:normal;
letter-spacing:0px;
color:#ffffff;
padding-top:40px;
}

</style>
</head>

<body>

<div class="sidebar">
<h1>About Me</h1>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec semper aliquet venenatis. Aliquam erat volutpat. Nam et suscipit velit. Vestibulum placerat, felis quis dictum interdum, neque est pulvinar neque, at eleifend purus mauris at sapien.

<h1>Navigate</h1>
<table width="200">
<tr><td>
<a class="navigation" href="LINK HERE">One</a>
</td><td>
<a class="navigation" href="LINK HERE">Two</a>
</td></tr><tr><td>
<a class="navigation" href="LINK HERE">Three</a>
</td><td>
<a class="navigation" href="LINK HERE">Four</a>
</td></tr><tr><td>
<a class="navigation" href="LINK HERE">Five</a>
</td><td>
<a class="navigation" href="LINK HERE">Six</a>
</td></tr><tr><td>
<a class="navigation" href="LINK HERE">Seven</a>
</td><td>
<a class="navigation" href="LINK HERE">Eight</a>
</td></tr></table>

<h1>Other</h1>
Aenean egestas posuere quam ullamcorper mollis. Pellentesque sem elit, euismod vitae adipiscing eu, placerat eu mi. In dapibus suscipit metus.

</div>

<div class="banner">
<h2>Website Title</h2>
</div>

<div class="main">
<h1>Hello There</h1>
This layout is not as easy to edit and rearrange as some of my templates, but you can change the colors. The header, footer, and text colors can all by changed through the coding. The main columns are created with an image, so you will need to copy <a href="http://cbimg6.com/layouts/09/12/36055aa.gif">this image</a> into your image editting program (MS Paint works just fine) and fill in the green and white parts with the colors of your choice. Then reupload the image on your favorite image host and plug it back into the code.<br><br>

<b>Bold.</b> <i>Italic.</i> <u>Underlined.</u> <a href="http://www.atomicaffliction.com" target="new">Link.</a><br><br>

Remember to exercise caution when editting the stylesheet. If you're not experienced with CSS or HTML, something can go haywire. The image portion of this layout may be particularly tough for inexperienced users. Don't hesitate to contact me if you run into a bit of trouble with this layout. I'd be more than happy to help. :)

</div>

<div class="footer">
© Your Site Here - <a href="http://www.atomicaffliction.com" target="new">Layout Credit</a>

</div>

</body>
</html>

Layout Comments

Showing latest 4 of 4 comments

I like it. Clean and simple.

By Butterface89 on Jul 26, 2010 7:08 pm

Why is that you always have awesome color palettes? >:[

Haha, great job, Gabi. Nonetheless. :D

By Mikeplyts on Jan 13, 2010 11:36 pm

i'm immensley impressed with the name of this layout ^_^
haha!

Well done gabi, i like it a lot :)

By Decode on Jan 1, 2010 10:05 am

I like the color combo :D
GOOD JOB!

By Snaily on Dec 31, 2009 10:05 pm

Layout Details

Designer	schizo
Submitted on	Dec 20, 2009
Page views	10,026
Favorites	28
Comments	4
Reviewer	manny-the-dino
Approved on	Dec 31, 2009

Blarg.

Designer's Comments

Layout Code

Layout Comments

Layout Details

Layout Colors

Layout Tags

Layout Tools

Layout Affiliates