Ai Otsuka - createblog

Designer's Comments

Look carefully for specific instructions

Don't try to "erase" off the credits because it's all flattened in there in the image along with everything else. >:] MWAHAHAHAHA. you: "no way" me: "way". ok

YOU MUST BE FLUENT IN HTML/CSS.

1]Change "username" to YOUR username, and yours only. If it's anything else, the links won't work.
2]Change "username2" to your friend's usernames, so they can be clicked on the best friend part. I've altered the header code so it would look ok even if you delete all but 1 icon for your best friends b/c you don't have much. Just kidding. It will look good with how many ever friends you have. I hope.
3]Change the image in the "about me" section to a 150 px by 200 px. Nothing else. It will most likely ruin the whole thing.
4]Don't type too much about you. Talking about you too much is bad for your health. Ok,ok, that's not true-or is it? Don't write too much because if you do, that div box will extend under the "best friend's" box.
5]Change the icon images to 100px by 100px ONLY. If you don't it will ruin THAT div box. The pictures can be cropped pictures of your friends, icons from Createblog, or your own self made icons.
6]LAST BUT NOT LEAST! AFTER ALL THAT RULE READING! ENJOY!

Using This Layout

For specific instructions read designer's comments

This is a Div Overlay layout, HTML knowledge required!
1. Log into createblog.com (customize)
2. Copy (ctrl c) and paste (ctrl v) code to the specified fields

Layout Code

Copy and paste to Header HTML

Help

#box{position: absolute; left:0%; margin-left: 475px; top:0%; margin-top: 0px; width: 450px; height: 200px; overflow:none;}

#friends{position: absolute; left:0%; margin-left: -375px; top:0%; margin-top: 400px; width: 800px; height: 200px; overflow:none;}

.head { color:#000000;line-height: 18px;text-align:right;font-size:24px;font-family:Arial;font-variant: none;background-color:#transparent;border-bottom: solid 4px #edae80}

.head2 { color:#000000;line-height: 18px;text-align:center;font-size:24px;font-family:Arial;font-variant: none;background-color:#transparent;border:none}

b{ color: #edae80; font-family: tahoma; font-size: 10px; }
i{ color: #edae80; font-family: tahoma; font-size: 10px; }
u{ color: #edae80; font-family: tahoma; font-size: 10px; }

</style>

<div id="ai">
<img src="http://cbimg9.com/layouts/08/04/26/27144aa.png" usemap="aimap" border="0">
<map name="aimap"> 
<area shape="rect" coords="251,308,302,337" href="http://www.createblog.com/home/">
<area shape="rect" coords="301,267,354,312" href="http://username.createblog.com/layouts/">
<area shape="rect" coords="354,213,406,267" href="http://username.createblog.com/graphics/">
<area shape="rect" coords="401,184,429,213" href="http://username.createblog.com/friends/add.php?height=100&width=300&nocache=1192663004">
<area shape="rect" coords="410,146,431,183" href="http://username.createblog.com/winks.php?height=400&width=300&nocache=1192662809">
</map> </div>
<div id="box">
<div class="head">About Me</div>
<img src="http://cbimg9.com/layouts/08/04/26/27144ab.jpg" hspace="3" vspace="3" align="right">About this layout:  I really liked this layout as a website template so I decided to turn it into a createblog layout.  This layout has taken a total of about three hours to code. 
<p><b>How To Use</b>: This layout will cover many of Createblog's features, it will cover your friend's page, blog page and picture page. Doesn't that just suck? But it's ok, you'll have a pretty layout to make up for it. Booyah. <b><u>YOU MUST BE FLUENT WITH HTML/CSS TO USE THIS LAYOUT.</b></u>
<br>1] Use <b>ctrl + F</b> or <b>Find...</b> to find <u>username</u>. Change that to your username, and your's ONLY! If you make a spelling error, most of the links won't work!
<br>2]Change the image to an image of ONLY 150 pixels by 200 pixels. It will most likely mess up the layout if it's bigger or smaller-not sure, not willing to test.
<br>
3]Change <b>username2</b> to your "bestfriend's " usernames so people can see them. You can delete the icons and replace with their pictures.
<div id="comments2">
<center>
<form action='comment.php' method='POST'>
	
	<textarea name='comment' cols='3'' rows='2' style="width: 140; height: 50px;" style="border-width: 1px; border-style: solid; border-color: 000000; font-family: small fonts; text-transform:uppercase; letter-spacing:1pt;font-size: 7px; color: 000000; background-color: ffffff;" style="overflow:auto;">¿Dónde esta mi amor? </textarea>
	
	<input type='submit' value='Esta aqui. ♥' style="border-width: 1px; border-style: solid; border-color: 000000; width:'140'px; font-family: small fonts; text-transform:uppercase; letter-spacing:1pt; font-size: 7px; color: 000000; background-color: ffffff;" class='button' />
	
	</form></div>
<div id="friends"><div class="head2">Best Friends</div><center>
<a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a><a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a><a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a><a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a><a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a><a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a><a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a><a href="http://www.username2.createblog.com"><img src="http://cbimg9.com/layouts/08/04/26/27144ac.jpg"></a></div>
</div>
</div>