The Simpsons

Designer's Comments

Look carefully for specific instructions

Well this is my very first layout, and I decided to do a Simpson theme because the movie is coming up just around the corner.

The layout is simple, and not too complex. It's my very first layout, so don't expect some masterpiece. -_-'

Credit:
Image base: www.thesimpsons.com
Font: Akbar

-For more of my layouts click here

Layout Code

Copy and paste to Template HTML

Help

<html>
<head>
<title>The Simpsons</title>
<style type="text/css">
body {
	background-color: #FFFFFF;
	background-image:url(http://cbimg9.com/layouts/07/07/07/19173ab.gif);
	background-repeat: repeat;
	margin: 0px;
	SCROLLBAR-ARROW-COLOR: #FFFFFF;
	SCROLLBAR-BASE-COLOR: #FFFFFF;
	SCROLLBAR-FACE-COLOR: #FFFFFF;
	SCROLLBAR-HIGHLIGHT-COLOR: #3b9a84;
	SCROLLBAR-SHADOW-COLOR: #3b9a84;
	SCROLLBAR-3DLIGHT-COLOR: #FFFFFF;
	SCROLLBAR-TRACK-COLOR: #FFFFFF;
	SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF;
}

a:link, a:visited, a:active{
text-decoration: none;
color: #ec5d33;
border-bottom: 1px dotted #000000;
}

A:hover{ 
text-decoration: none;
color: #713221;
border-bottom: dotted 1px #000000;
}

a.box:link, a.box:visited, a.box:active {
text-decoration : none;
color : #000000;
font-size : 7pt;
text-align: center;
text-transform: UPPERCASE;
line-height: 12pt;
font-family : verdana;
border-bottom:1px solid #000000;
display:block;}

a.box:hover {
	text-transform: none;
	background: url() no-repeat;
    background-color: #a1eaff;
	padding: 0px 0px 0px 0px;
	color: #1d3d88;
	text-align:center;
	text-transform: UPPERCASE;
	border-bottom:1px solid #000000;
	display:block;}

b {
 color: #f3399c;
	font-weight: bold;
	font-size: 10px;
	text-transform: uppercase;
	font-family: Verdana;
}

I {
 color: #1fadff;
 letter-spacing:1px;
 font-size:10px;
 text-transform:none;
}

u {
 color: #0f4539;
 letter-spacing:1px;
 font-size: 10px;
 text-transform:none;
}

#navigation {
	position: absolute;
	width: 184px;
	height:529px;
	overflow: hidden;
	font-family: Verdana;
	font-size: 10px;
	color: #000000;
	top: 591px;
	left: 44px;
	line-height: normal;
}
#content {
	position: absolute;
	width: 325px;
    height:530px;
	line-height:12px;
	overflow: auto;
	font-family: verdana;
	font-size: 10px;
	color: #000000;
	text-align: justify;
	top: 591px;
	left: 269px;
}

.Head1 /*Use this heading for the left column*/
{
	background-color: #a235ef;
	color: #FFFFFF;
	text-align: center;
	font-family: verdana;
	font-size: 9pt;
	letter-spacing: 2px;
	border-bottom:3px solid #000000;
	border-top:3px solid #000000;
	line-height: 15pt;
	text-transform:uppercase;
	font-weight: bold;
}

.Head2 /*Use this heading for the right column*/
{
	background-color: #f25a31;
	color: #FFFFFF;
	text-align: right;
	font-family: verdana;
	font-size: 9pt;
	letter-spacing: 2px;
	border-bottom:3px solid #000000;
	border-top:3px solid #000000;
	line-height: 15pt;
	text-transform:uppercase;
	font-weight: bold;
}

</style>
</head>

<div id="navigation">
  <div class="Head1">About Me</div>
  <b>Name</b>:
    <br>
    <b>DOB</b>:
    <br>
    <b>Gender</b>:
    <br>
    etc etc etc etc
    <br>
  Put stuff about yourself here!</p>
  <br><br><br><br>
  <div class="Head1">Navigation</div>
  <a href="www.createblog.com" class="box">Link</a>
  <a href="http://createblog.com" class="box">Link</a>
  <a href="http://createblog.com" class="box">Link</a>
  <a href="http://createblog.com" class="box">Link</a>
  <a href="http://createblog.com" class="box">Link</a>
  <a href="http://createblog.com" class="box">Link</a><br><br><br>
  
  <div class="Head1">Credit</div>
  Layout made by <a href="http://hjp.createblog.com/">Haileypo</a> also check out <a href="http://createblog.com">Cb!</a></div>

<div id="content">
  <div class="Head2">Header Please!</div><br>
Write whatever you please here, talk about your day or whether you like M&Ms over smarties or vise-versa.<br><br><br><br>
  
  
  
  <div class="Head2">HTML</div><br>
<b>This is bold</b> <br><br>
<i>This is italic</i><br><br>
<u>This is underlined</u><br><br>
<a href="http://createblog.com">This is a link without the box code</a><br><br>
<a href="http://createblog.com" class="box">This is a link with the box code</a>

<div class="Head2">Layout Info</div><br>
Well this is my very first layout so be aware of that!  The background and main pic were made by me using <b>Paintshop Pro 8</b>.  The codes were put together by me using <b>Dreamweaver 8</b>
</div>
  
  
  
</html>