Me,Myself & I

Designer's Comments

Look carefully for specific instructions

Me,Myself & I

Layout Code

Copy and paste to Template HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Me,Myself & I</title>
<style type="text/css"> 
<!-- 
body  {
	margin: 0;
	padding: 0;
	text-align: center;
	color: #000000;
	background-image: url(http://cbimg6.com/layouts/08/03/06/26006ab.jpg);
	display: block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: normal;
	background-color: #622C2A;
	list-style-type: none;
	overflow: auto;
	background-attachment: scroll;
	cursor: crosshair;
}

.twoColElsLtHdr #container {
	width: 46%; 
	background: #FFFFFF;
	margin: 0 auto; 
	border: 1px solid #000000;
	text-align: left; 
} 
.twoColElsLtHdr #header {
	background: #ffffff;
	padding: 0 10px;  
} 
.twoColElsLtHdr #header h1 {
	margin: 0; 
	padding: 10px 0;
}

.twoColElsLtHdr #sidebar1 {
	float: left;
	width: 12em; 
	background: #ffffff; 
	padding: 15px 0; 
}
.twoColElsLtHdr #sidebar1 h3, .twoColElsLtHdr #sidebar1 p {
	margin-left: 10px; 
	margin-right: 10px;
}

.twoColElsLtHdr #mainContent {
	margin: 0 1.5em 0 13em; 
} 
.twoColElsLtHdr #footer {
	padding: 0 10px; 
	background:#ffffff;
	border-top-color: #5E2B2A;
	border-top-style: dashed;
	border-top-width: thin;
} 
.twoColElsLtHdr #footer p {
	margin: 0; 
	padding: 10px 0; 
}

.fltrt { 
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.style2 {
	font-family: "Eras Light ITC";
	display: block;
	background-color: #632B2C;
	font-size: medium;
	color: #FFFFFF;
}
a {
	font-size: 14px;
}
a:link {
	color: #632B2C;
	text-decoration: none;
}
a:visited {
	color: #9D7374;
	text-decoration: none;
}
a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
a:active {
	color: #FFFFFF;
	text-decoration: none;
}

</style>
<script src="Scripts/AC_ActiveX.js" type="text/javascript"></script>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<div id="container">
  <div id="header">
    <h1 align="center"><img src="http://cbimg6.com/layouts/08/03/06/26006aa.jpg" width="500" height="237" align="absmiddle" /></h1>
  </div>
  <div id="sidebar1">
    <div align="center">
      <div align="right">
        <h3 class="style2">Navigation </h3>
      </div>
      <p class="twoColElsLtHdr"><a href="http://www.link.com">Link</a></p>
      <p class="twoColElsLtHdr"><a href="http://www.link.com">Link</a></p>
      <p class="twoColElsLtHdr"><a href="http://www.link.com">Link</a></p>
      <p class="twoColElsLtHdr"><a href="http://www.link.com">Link</a></p>
      <p class="twoColElsLtHdr"><a href="http://www.link.com">Link</a></p>
      <h3 align="right" class="style2">Extra Heading</h3>
      <p align="center" class="twoColElsLtHdr">Use this space for whatever you would like eg <a href="http://www.shoutmix.com/main/" target="_blank">Shoutbox</a> or a <a href="http://www.youtube.com/" target="_blank">youtube</a> video</p>
      <p align="center" class="twoColElsLtHdr">No wider than160 pixels wide.</p>
      <p align="center" class="twoColElsLtHdr"><script type="text/javascript">
AC_AX_RunContent( 'width','160','height','160','src','http://www.youtube.com/v/bBnihNlc-vI&rel=1&border=0','type','application/x-shockwave-flash','wmode','transparent','movie','http://www.youtube.com/v/bBnihNlc-vI&rel=1&border=0' ); //end AC code
</script><noscript><object width="160" height="160"><param name="movie" value="http://www.youtube.com/v/bBnihNlc-vI"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/bBnihNlc-vI" type="application/x-shockwave-flash" wmode="transparent" width="160" height="160"></embed></object></noscript> </p>
      <h3 align="center" class="style2">Affiliates/Friends</h3>
      <p align="center" class="twoColElsLtHdr"><a href="http://www.darrenhayes.com/" target="_blank">DarrenHayes.com</a></p>
      <p align="center" class="twoColElsLtHdr"><a href="http://www.bebo.com/Profile.jsp?MemberId=4914589880" target="_blank">Darren Hayes Bebo</a></p>
      <p align="center" class="twoColElsLtHdr"><a href="http://profile.myspace.com/index.cfm?fuseaction=user.viewprofile&friendid=140713037" target="_blank">Darren Hayes Myspace</a></p>
      <h3 class="style2">Credits      </h3>
      <p align="center" class="twoColElsLtHdr">Content|©You</p>
      <p align="center" class="twoColElsLtHdr">Design|<a href="http://anzbex.createblog.com/" target="_blank">Anzbex</a></p>
      <p align="right" class="twoColElsLtHdr"> </p>
    </div>
 
  </div>
  <div id="mainContent">
    <h1 align="right" class="style2"> Blog </h1>
    <p>March 5th 2008 7:30 pm</p>
    <p>DO NOT REMOVE CREDITS OR COPYRIGHT!!!</p>
    <p>Tested in Firefox , IE & Opera</p>
    <p>|Styles|</p>
    <p><strong>Bold</strong> , <em>Italic</em> , <s>Strikethrough</s> , <u>Underline</u> , <a href="http://www.link.com">Link</a></p>
    <p> You can put whatever you like here ...Blah blah blah blah blah blah blah blah blah blah blah blah blah Blah blah blah blah blah blah blah blah blah blah blah blah blah Blah blah blah blah blah blah blah blah blah blah blah blah blah Blah blah blah blah blah blah blah blah blah blah blah blah blah.</p>
    <h2 align="right" class="style2">Extra </h2>
    <p>This is my first layout here for <a href="http://www.createblog.com/" target="_blank">createblog</a> I hope you enjoy it :)</p>
    <p> </p>
    <p> </p>
    </div>
	<br class="clearfloat" />
   <div id="footer">
    <p align="center"><span class="style8 style8">© Your Site Name 2008 | Layout by <a href="http://anzbex.createblog.com/">anzbex</a></span></p>
</div>
</div>
</body>
</html>

Layout Comments

Showing latest 6 of 6 comments

AH!
First layout I've seen of Darren. It's nice.

By gazimmy on Mar 7, 2008 6:39 pm

Not bad for your first layout at cB. :) Btw, it's aligned perfectly for me in FF though.

By dreamgurl36 on Mar 7, 2008 11:43 am

Um..I'm using Firefox and it is centered. I guess the whole "misaligned" claim is due to a smaller resolution?
Anyway, I do agree that it would look better with a smaller font size. But I think you did a good job, especially for a first layout.

By StrawberryFields on Mar 6, 2008 11:57 pm

@ NickMan .. you are correct. very misaligned in firefox.

By emberfly on Mar 6, 2008 9:20 pm

Yeah. I agree. And its misaligned in Firefox.

By NICKAWHAT on Mar 6, 2008 8:27 pm

I think it would look better if you had used a smaller font size for the main text.

By tokyo-rose on Mar 6, 2008 8:09 pm

Layout Details

Designer	anzbex
Submitted on	Mar 6, 2008
Page views	6,247
Favorites	7
Comments	6
Reviewer	agiri
Approved on	Mar 6, 2008

Me,Myself & I

Designer's Comments

Layout Code

Layout Comments

Layout Details

Layout Tags

Layout Tools

Layout Affiliates