GREEN!

Designer's Comments

Look carefully for specific instructions

And? what do you think?

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>Green world!</title>
  <meta http-equiv="Content-Type"
 content="text/html; charset=iso-8859-1">
  <style type="text/css">body { background-color: #abb99b;
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;
}
#top {
height: 51px;
width:1600px;
background-color: transparent;
float: left;
margin: 0px;
}
#top-pic {
height: 51px;
width:583px;
background-image: url(http://cbimg6.com/layouts/09/07/35145aa.jpg);
float: left;
margin: 0px;
}
#head {
height: 100px;
width:1600px;
background-image: url(http://cbimg6.com/layouts/09/07/35145ab.gif);
float: left;
margin: 0px;
}
#head-pic {
height: 100px;
width:640px;
background-image: url(http://cbimg6.com/layouts/09/07/35145ac.jpg);
float: left;
margin: 0px;
}
#navi1 {
height: 31px;
width:1600px;
background-image: url(http://cbimg6.com/layouts/09/07/35145ad.gif);
float: left;
margin: 0px;
}
#navi1-space {
height: 31px;
width:153px;
background-image: url(http://cbimg6.com/layouts/09/07/35145ad.gif);
float: left;
margin: 0px;
}
#navi1-head {
height: 31px;
width:500px;
background-image: url(http://cbimg6.com/layouts/09/07/35145ad.gif);
float: left;
margin: 0px;
}
#content-parent {
width: 1600px;
background-color: transparent;
float: left;
}
#content-navi {
width: 153px;
background-color: transparent;
float: left;
}
#content-main {
width: 500px;
color: #fff;
background-color: transparent;
margin: 0px;
padding: 2px 5px 2px 5px;
font-size:11px;
font-family:arial;
overflow: auto;
float: left;
line-height: 15px;
text-align: justify;
}
#content-box {
width: 153px;
background-color: transparent;
float: left;
color: #2b3421;
padding: 2px 2px 2px 2px;
font-size:8px;
font-family:arial;
overflow: auto;
text-transform: uppercase;
line-height: 10px;
text-align: left;
}
#navi-box {
margin: 5px 0px 5px 0px;
background-image: url(http://cbimg6.com/layouts/09/07/35145ae.gif);
width: 153px;
float: left;
color: #000;
font-family: arial;
font-size: 10px;
line-height: 14px;
text-align: justify;
}
#navi-box a { text-decoration: none;
color: #531203;
display: block;
padding: 4px 0px 4px 0px;
font-family: arial;
font-size: 10px;
line-height: 12px;
font-style: normal;
text-align: center;
border-bottom: 1px dotted #45589b;
}
#navi-box a:hover { color:#fc1600;
cursor: default;
background-color: transparent;
text-decoration: none;
font-style: none;
border-bottom: 1px dotted #c14174;
}
h4 { font-family: arial;
color: #fff;
letter-spacing: -1;
line-height: 3px;
font-size: 15px;
text-align: center;
text-transform: uppercase;
letter-spacing: none;
background-image: url(http://cbimg6.com/layouts/09/07/35145af.gif);
}
h3 { font-family: arial;
color: #fff;
letter-spacing: none;
line-height: 15px;
font-size: 12px;
text-align: left;
border-top: 5px solid #fc1600;
letter-spacing: 2;
background-image: url(http://cbimg6.com/layouts/09/07/35145af.gif);
text-transform: uppercase;
padding: 0px 2px 5px 2px;
margin: -1px 0px 0px 0px;
}
h2 { font-family: arial;
color: #283625;
line-height: 14px;
font-size: 10px;
text-align: left;
text-decoration: none;
background-image: url(http://cbimg6.com/layouts/09/07/35145ae.gif);
margin: -12px 0px 8px 0px;
}
h1 { font-family: arial;
color: #fff;
letter-spacing: -1;line-height: 20px;
font-size: 15px;
text-align: left;
background-image: url(http://cbimg6.com/layouts/09/07/35145af.gif);
padding: 0px 0px 10px 0px;
border-top: 5px solid #fc1600;
margin: -1px 0px 0px 0px;
}
ul { font-family: arial;
font-size: 10px;line-height: 11px;
color: #e1c0b0;
background-color: transparent;
}
#content-main a, #content-main a:link, #content-main a:active, #content-main 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-main a:hover, #content-main a:focus {
color:#fff;
background-color: transparent;
cursor: default;
text-decoration: none;
font-style: normal;
cursor: help;
}
#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 { background-image: url(http://cbimg6.com/layouts/09/07/35145ae.gif);
font-size: 10px;
line-height: 15px;
color: #283625;
text-align: left;
border-top: 5px solid #fc1600;
border-left: 1px solid #fc1600;
border-right: 1px solid #fc1600;
border-bottom: 1px solid #fc1600;
font-size: 10px;
line-height: 11px;
font-family: arial;
overflow: auto;
}
input { border: 1px solid #fc1600;
background-image: url(http://cbimg6.com/layouts/09/07/35145ae.gif);
font-size: 10px;
line-height: 11px;
font-family: arial;
color: #283625;
}
b, strong { font-family: arial black;
font-size: 12px;line-height: 12px;
color: #283625;
font-weight: bold;
}
i, em { font-family: arial;
font-size: 11px;line-height: 9px;
color: #ffbd40;
font-style: italic;
}
u { font-family: arial;
font-size: 11px;line-height: 9px;
color: #fff;
text-decoration: none;
background-image: url(http://cbimg6.com/layouts/09/07/35145ae.gif);
border-bottom: 2px solid #fc1600;
}
s, stroke { font-family: arial;
font-size: 11px;line-height: 9px;
color: #fc1600;
text-decoration: line-through;
}
m { font-family: arial;
font-size: 11px;
line-height: 13px;
color: #fff;
text-decoration: none;
background-image: url(http://cbimg6.com/layouts/09/07/35145af.gif);
margin: 0px 2px 0px 2px;
padding: 0px 3px 0px 3px;
}
blockquote {
margin: 15px;
padding: 15px;
background-image: url(http://cbimg6.com/layouts/09/07/35145ae.gif);
font-size: 10px;
line-height: 15px;
color: #283625;
text-align: left;
border-top: 5px solid #fc1600;
}
blockquote:before { font-family: georgia;
color: #fc1600;
content: open-quote;
font-weight: bold;
font-size: 20pt;
padding: 0px 2px 0px 0px;
}
  </style>

</head>
<body>
<div id="parent">

<div id="top">
<div id="top-pic">.</div>
</div>

<div id="head">
<div id="head-pic">.</div>
</div>

<div id="navi1">
<div id="navi1-space">.</div>
<div id="navi1-head">.</div>
</div>


<div id="content-parent">
<div id="content-navi">
<div id="navi-box">
<h4> Green World </h4>
<a href="#"> Why is it grey outside? </a>
<a href="#">Why don’t I see green? </a>
<a href="#">Wasn’t this world meant to be...
green? </a>
</div>


<div id="navi-box">
<h4>Navigation</h4>
<a href="#">A green world? </a>
<a href="#">A green person? </a>
<a href="#">A green earth? </a>
</div>


<div id="navi-box">
<h4>Credits</h4>
<a href="http://zebiii.createblog.com/">design &
code
by ZeBiii</a>
<a href="http://shizoo.frozen-media.de/">Basic Icons by
Shizoo</a>
</div>

</div>

<div id="content-main">
<h1>Lorem Ipsum</h1>
<h2>SubHeadline</h2>
Lorem ipsum in nec eirmod iudicabit, dicta civibus <b>mnesarchum</b>
at vix.
Cum an soleat detraxit constituto, cu euismod detraxit consulatu nam.
Ad tollit graeco adipisci duo! <m>Ut duo harum nihil sanctus</m>,
ne
liber
scripserit mea? His id exerci tempor minimum, pro an justo
maluisset.
Labore eripuit inermis no pri, his error affert placerat eu, per
viderer suscipiantur ut? <u>Ne cum lorem atomorum persequeris.</u>
Qui mundi
delenit imperdiet no. Mei ut corpora invenire instructior. Ut cum
libris equidem, ut omnium laoreet mei! Definiebas cotidieque eam id, no
mei invidunt platonem interesset, <s>pro unum aliquam
concludaturque et</s>?
Debet nostro vim at, veritus voluptatibus et vel? Sonet quidam
salutandi te sed? Tollit eirmod ut eos? Mel ea suas harum quidam! Has
dicit affert postea cu, at ius disputando voluptatibus, vel ei vidisse
accusata theophrastus. Lucilius expetenda ei <i>vix,ut mea malis
legimus</i>
torquatos.<br>
<br>
<blockquote>- <b>Bold</b><br>
- <i>Italic</i><br>
- <u>Underline</u><br>
- <s>Stroke</s><br>
- <m>Mark</m><br>
  <u>Do not remove the Copyright and credits!!!</u>
</blockquote>
</div>


<div id="content-box">
<h3>Green...</h3>
Why is it grey outside?
<br>
Why when I look,
<br>
Why don’t I see green?
<br>
Wasn’t this world meant to be... green?
<br>
I still can’t see green,
<br>
Yet we were born on...
<br>
A green world?
<br>
Stop!
<br>
Help me!
<br>
Make us see green!
<br>
Plant a tree!
Knock down a house!
Let us see green!
<br>
Don’t let our world die,
<br>
It’s a green world,
<br>
Not a grey one,<br>
 It’s a green world,
<br>
Not a grey one! </div>

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

Layout Comments

Showing latest 8 of 8 comments

thats hottttttt

By emmijane on Mar 6, 2010 7:04 am

woah, this is beautiful. Very smart using these kinds of green.

By goth-nina on Jul 25, 2009 12:17 pm

this is amazing.
;]

By xii3 on Jul 13, 2009 11:01 am

nice. (:

By futura on Jul 12, 2009 3:43 am

In IE, the headers that say "Green World" and "Navigation" etc. get cut off because the line-height is too low. Which is a shame because I really like the way they look in the preivew. I think this is very pretty, and I agreee with LadyLBlack, the CSS styles are very nice.

By CrotchetTheLeper on Jul 11, 2009 11:39 am

I like this its a really nice Css

By LadyLBlack on Jul 11, 2009 8:43 am

looks cool. :)

By Mikeplyts on Jul 11, 2009 2:33 am

Oh..Looks Nice :D!!
I like the textures!
Good Job ^.^

By Snaily on Jul 11, 2009 1:57 am

Layout Details

Designer	ZeBiii
Submitted on	Jul 10, 2009
Page views	4,464
Favorites	6
Comments	8
Reviewer	schizo
Approved on	Jul 10, 2009

GREEN!

Designer's Comments

Layout Code

Layout Comments

Layout Details

Layout Colors

Layout Tags

Layout Tools

Layout Affiliates