InsaneJournal

Tweak says, "Glaring is a powerful skill"

Ashley (allrainydays) wrote in rp_tutorials,
@ 2012-10-27 16:08:00

Entry tags:

layouts: media, layouts: media: facebook

Facebook Timeline Profile
You know when you have one of those days where you just want to challenge yourself and see if you could maybe, possibly, pull it off? I had one of those on Monday. And obsessed. So, I give you, a new Facebook profile page, styled after Timeline and (hopefully) easy to follow.

Rules & Directions
» Images are on imgur and should be all right to be hotlinked, but if you want to upload them to your server, feel free!
» There are more history icons than shown!! Visit the imgur album to see the rest (wedding, break up, remodeling, new glasses, etc; 23 in total).
» Credit is not necessary, but if you could link them back to

allrainydays or

rp_tutorials so they know how to find it, that would be awesome.
» Let me know if you need any additional help with the modifications. I've tried to make it as easy to understand as possible, but don't hesitate to ask.
» Feel free to leave a link with your live example and I may feature it!

Example 1

<lj-raw>

<!-- Welcome to the Facebook Timeline character profile!  Credit is not necessary, but I would love you forever if you gave me credit (starrylites@IJ or starrylites@LJ) so other people know where to find it.

Image dimensions:
• Cover Photo is 880x325
• Profile Picture is 150x150
• Photos, Map, and Likes are 111x74
• All other images are square and can take 100x100 images or you can resize to the designated sizes

I have tried to put all changing content in CAPS so that it is easier for you to spot. Happy coding!-->

</div>
</div>

<div id="Name" style="font-weight: normal; color:#333333; font-size: 20px; font-weight: bold; font-family:Lucida Grande, tahoma, verdana, arial, sans-serif; position: relative; margin: 15px 0 0 205px; float: left;">
FIRST LAST
</div>
<br style="clear: both;">

<div id="Info_Box" style="width: 325px; height: 74px; background-color:#f1f3f8; border-style:solid; border-width: 1px 1px 1px 0; border-color:#c4cde0; position:relative; top: 25px; left: 0; float:left; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px; -moz-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; font-size: 10px; font-weight: normal; color:#333333; line-height:14px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; ">
<div style="margin: 10px 10px 5px 30px;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/nYzmZ.png"></div>JOB TITLE at <span style="color:#3b5998;">PLACE OF EMPLOYMENT</span><br />
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/lW9Vn.png"></div>Studied EMPHASIS at <span style="color:#3b5998;">COLLEGE/UNIVERSITY</span><br />
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/hYTdc.png"></div>Lives in <span style="color:#3b5998;">CURRENT CITY</span><br />
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/fc54c.png"></div>From <span style="color:#3b5998;">HOMETOWN</span><br />
</div>
</div>

<div id="Friends" style="color:#3b5998; font-size:11px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; position:relative; top: 25px; margin: 0 0 0 35px; float:left;">
<div style="width:111px; height: 74px; border-style:solid; border-width: 1px; border-color:#C2C2C2; -moz-border-radius: 3px; border-radius: 3px; margin-bottom:5px;">
<img src="http://i.imgur.com/8audZ.png" style="width:37px; height:37px;"><img src="http://i.imgur.com/EVzpY.png" style="width:37px; height:37px;"><img src="http://i.imgur.com/8audZ.png" style="width:37px; height:37px;"><br />
<img src="http://i.imgur.com/EVzpY.png" style="width:37px; height:37px;"><img src="http://i.imgur.com/8audZ.png" style="width:37px; height:37px;"><img src="http://i.imgur.com/EVzpY.png" style="width:37px; height:37px;">
</div>
Friends <span style="color:#999999;">XXX</span>
</div>

<div id="Photos" style="color:#3b5998; font-size:11px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; position:relative; top: 25px; margin: 0 0 0 10px; float:left;">
<div style="width:111px; height: 74px; border-style:solid; border-width: 1px; border-color:#C2C2C2; -moz-border-radius: 3px; border-radius: 3px; margin-bottom:5px;">
<img src="http://i.imgur.com/d3lhR.png">
</div>
Photos <span style="color:#999999;" style="width:111px; height;74px;">XXX</span>
</div>

<div id="Likes" style="color:#3b5998; font-size:11px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; position:relative; top: 25px; margin: 0 0 0 10px; float:left;">
<div style="width:111px; height: 74px; border-style:solid; border-width: 1px; border-color:#C2C2C2; -moz-border-radius: 3px; border-radius: 3px; margin-bottom:5px;">
<img src="http://i.imgur.com/C9plv.png" style="width:111px; height;74px;">
</div>
Likes <span style="color:#999999;">XXX</span>
</div>

</div>

<div id="Likes_Container" style="width: 850px; background-color:#ffffff; border-style:solid; border-width:1px; border-color:#c4cde0; padding:15px 15px 15px 15px; margin:5px 10px 10px 5px; overflow: visible;  -moz-border-radius: 3px; border-radius: 3px;">
<div style="float: left; text-align: left;font-size: 16px; font-weight: bold; color:#333333; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin: 10px 0 25px 20px;">
Favorites
</div>
<br style="clear: both;">

<div style="float: left; text-align: left; vertical-align: top; width: 100px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 20px 0;">
Music
</div>

<div style="float: left; text-align: center; line-height: 11px; font-size: 11px; font-weight: normal; color:#3b5998; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 20px 0; width:90px;">
<img src="http://i.imgur.com/ZTbYb.png" style="width:90px; height:90px; padding-bottom:7px;"><br>
MUSIC 1
</div>

</div>

<div style="float:left;"><img src="http://i.imgur.com/9JLIJ.png"></div> Work and Education
</div>
<br style="clear: both;">

<div style="float: left; text-align: left; vertical-align: top; width: 75px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 20px 10px;">
Employers
</div>

<div style="float: left; margin: 0 10px 0 0;"><img src="http://i.imgur.com/a3dwC.png" style="width:50px; height:50px;">
</div><span style="font-weight: bold; color:#3b5998; line-height:15px;">PLACE OF EMPLOYMENT</span><br>
JOB TITLE • CITY, STATE<br>
MONTH to Present

<img style="margin: 20px 10px 20px 0; width:375px; height:1px;" src="http://i.imgur.com/I9HZX.png">
<div style="float: left; margin: 0 10px 0 0;"><img src="http://i.imgur.com/a3dwC.png" style="width:50px; height:50px;">
</div><span style="font-weight: bold; color:#3b5998; line-height:15px;">FORMER PLACE OF EMPLOYMENT</span><br>
JOB TITLE • CITY, STATE<br>
MONTH to MONTH

</div>
<br style="clear: both;">

<img style="margin: 0 0 10px 10px; width:480px; height:1px;" src="http://i.imgur.com/I9HZX.png">
<br style="clear: both;">
<div style="float: left; text-align: left; vertical-align: top; width: 75px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 20px 10px;">
College
</div>
<div style="width:400px; float: left; text-align: left; font-size: 11px; font-weight: normal; color:#808080; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 20px 0;">
<div style="float: left; margin: 0 10px 0 0;"><img src="http://i.imgur.com/yn7nK.png" style="width:50x; height:50px;"></div><span style="font-weight: bold; color:#3b5998; line-height:15px;">PLACE OF STUDY</span><br>
Class of DATE • DISCIPLINE<br>
CITY, STATE
</div>
<br style="clear: both;">

<img style="margin: 0 0 10px 10px; width:480px; height:1px;" src="http://i.imgur.com/I9HZX.png">
<br style="clear: both;">
<div style="float: left; text-align: left; vertical-align: top; width: 75px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 20px 10px;">
High<br>School
</div>
<div style="width:400px; float: left; text-align: left; font-size: 11px; font-weight: normal; color:#808080; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 20px 0;">
<div style="float: left; margin: 0 10px 0 0;"><img src="http://i.imgur.com/yn7nK.png" style="width:50x; height:50px;"></div><span style="font-weight: bold; color:#3b5998; line-height:15px;">PLACE OF STUDY</span><br>
Class of DATE<br>
CITY, STATE
</div>
<br style="clear: both;">

</div>

<div style="float: left; text-align: left;font-size: 16px; font-weight: bold; color:#333333; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin: 10px 0 25px 20px;">
<div style="float:left;"><img src="http://i.imgur.com/OEJF8.png"></div>
 Family
</div>
<br style="clear: both;">

<div style="float: left; margin:0 5px 20px 20px;"><img src="http://i.imgur.com/8audZ.png" style="width:90px; height:90px;"></div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#808080; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 20px 5px;"><span style="font-weight: bold; color:#3b5998; line-height:15px;">FIRST LAST</span><br>
Father<br>
</div>
<br style="clear: both;">

<div style="float: left; margin:0 5px 20px 20px;"><img src="http://i.imgur.com/EVzpY.png" style="width:90px; height:90px;"></div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#808080; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 20px 5px;"><span style="font-weight: bold; color:#3b5998; line-height:15px;">FIRST LAST</span><br>
Mother<br>
</div>
<br style="clear: both;">

<div style="float: left; margin:0 5px 20px 20px;"><img src="http://i.imgur.com/8audZ.png" style="width:90px; height:90px;"></div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#808080; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 20px 5px;"><span style="font-weight: bold; color:#3b5998; line-height:15px;">FIRST LAST</span><br>
Brother<br>
</div>
<br style="clear: both;">

<div style="float: left; margin:0 5px 20px 20px;"><img src="http://i.imgur.com/EVzpY.png" style="width:90px; height:90px;"></div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#808080; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 20px 5px;"><span style="font-weight: bold; color:#3b5998; line-height:15px;">FIRST LAST</span><br>
Sister<br>
</div>
<br style="clear: both;">

</div>

</div>

<div id="History_Container" style="background-color:#ffffff; border-style:solid; border-width:1px; border-color:#c4cde0; padding:15px 15px 40px 15px; overflow: visible; margin: 0 0 15px 0;  -moz-border-radius: 3px; border-radius: 3px;">

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/tY1Vy.png"></div>
EDUCATION EVENT
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/QdNV2.png"></div>
RELATIONSHIP EVENT
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/QAE16.png"></div>
PET EVENT
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/465Ve.png"></div>
EMPLOYMENT EVENT
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/dURBc.png"></div>
MOVING EVENT
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/udiAj.png"></div>
WELLNESS EVENT
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/rv30b.png"></div>
GENERIC EVENT
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 40px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 0 5px 10px;">
DATE</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#3b5998; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 5px 0;">
<div style="float: left; margin: 0 5px 0 0;"><img src="http://i.imgur.com/b6X1P.png"></div>
BIRTHDATE
</div>

</div>

<div style="float: left; text-align: left; vertical-align: top; width: 105px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 0 5px 10px;">
Birthday</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 10px 5px 0;">MONTH DAY, YEAR
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 105px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 0 5px 10px;">
Sex</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 10px 5px 0;">FEMALE/MALE
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 105px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 0 5px 10px;">
Interested In</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 10px 5px 0;">MEN/WOMEN
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 105px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 0 5px 10px;">
Relationship Status</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 10px 5px 0;">STATUS
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 105px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 0 5px 10px;">
Languages</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 10px 5px 0;"><span style="color:#3b5998; font-weight:bold;">LANGUAGE</span> and <span style="color:#3b5998; font-weight:bold;">LANGUAGE</span>
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 105px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 0 5px 10px;">
Religious Views</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 10px 5px 0;"><span style="color:#3b5998; font-weight:bold;">AFFILIATION</span>
</div>

<div style="float: left; text-align: left; vertical-align: top; width: 105px; font-size: 11px; font-weight: bold; color:#999999; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 0 5px 10px;">
Political Views</div>
<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:13px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:5px 10px 5px 0;"><span style="color:#3b5998; font-weight:bold;">AFFILIATION</span>
</div>

</div>

<div style="float: left; text-align: left;font-size: 16px; font-weight: bold; color:#333333; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin: 10px 0 25px 20px;">
Favorite Quotations
</div>
<br style="clear: both;">

<div style="float: left; text-align: left; font-size: 11px; font-weight: normal; color:#333333; line-height:15px; font-family:Lucida Grande,tahoma,verdana,arial,sans-serif; margin:0 10px 10px 10px;">
THIS IS JUST A TEXT BOX FOR YOU TO PLAY WITH TO YOUR HEART'S CONTENT. BE AWARE THAT BECAUSE THIS IS BEING DONE INSIDE AN [LJ-RAW] TAG THAT YOU MUST DO YOUR OWN CARRIAGE RETURNS AND OTHER AUTO-FORMATTING.
</div>
<br style="clear: both;">

</div>

</div>

</div>

</div>
</lj-raw>

(Post a new comment)

	gingerly 2012-10-27 11:15 pm UTC (link)
	OBSESSED. YOU ARE THE BEST, LADY. (Reply to this) (Thread)

	allrainydays 2012-10-28 07:27 am UTC (link)
	:D <3 (Reply to this) (Parent)

	theoddfanaticat 2012-10-28 12:05 am UTC (link)
	This is awesome. _ (Reply to this) (Thread)

	allrainydays 2012-10-28 07:27 am UTC (link)
	Thanks! (Reply to this) (Parent)

	myteeveesays 2012-10-28 12:59 am UTC (link)
	Ooooeooooooeeoooooo im just gonna sit here in stun for a sec. Ooooooo (Reply to this) (Thread)

	allrainydays 2012-10-28 07:27 am UTC (link)
	Aw, thank you! I tend to do that, too. LOL (Reply to this) (Parent)

	timefortacos 2012-10-28 02:08 am UTC (link)
	O__O (Reply to this) (Thread)

	allrainydays 2012-10-28 07:28 am UTC (link)
	Ha, thanks? (Reply to this) (Parent) (Thread)

	timefortacos 2012-10-28 07:32 am UTC (link)
	Yes! This is AMAZING! (Reply to this) (Parent) (Thread)

	allrainydays 2012-10-28 07:36 am UTC (link)
	Aw, thank you! It was one of those true sense of accomplishment moments :D ha (Reply to this) (Parent)

	tessisamess 2012-10-28 02:42 am UTC (link)
	NICE. (Reply to this) (Thread)

	allrainydays 2012-10-28 07:28 am UTC (link)
	Thank you! (Reply to this) (Parent)

	tellthenight 2012-10-28 02:58 am UTC (link)
	Okay so I have literally no use for this. Really, literally none. But omfg that code, with the divs. Omg it's gorgeous. So, are you accepting marriage proposals...? (Reply to this) (Thread)

	allrainydays 2012-10-28 07:30 am UTC (link)
	I gladly take wedding proposals, please and thank you! ;) haha But thank you. That's a large reason of why I did it. I understand divs SO MUCH BETTER than I did a week ago, aha. (Reply to this) (Parent)

	lauraparis 2012-10-28 04:37 pm UTC (link)
	You are the bestest. (Reply to this) (Thread)

	allrainydays 2012-10-28 11:49 pm UTC (link)
	No, you're the bestest. (Reply to this) (Parent) (Thread)

	lauraparis 2012-10-29 03:14 am UTC (link)
	No you are. (Reply to this) (Parent)

	teamblake 2012-10-28 07:03 pm UTC (link)
	This is absolutely stunning but is there anyway to center the whole thing? When I tried it centered the things within the divs too. (Reply to this) (Thread)

	allrainydays 2012-10-28 11:49 pm UTC (link)
	A very good question! I tried a couple of things that worked when I've done it on a website, but they don't seem to be reading in IJ (I hadn't considered it before because I use a pretty small laptop so it takes up all of my white space when I look at an entry). I'll keep trying a few more tricks, but it may be difficult since all the divs are relative and not absolute. (Reply to this) (Parent)

	itwasarobothead 2012-10-29 02:50 pm UTC (link)
	It looks like if you drop the whole thing into a table, it'll work without centering the divs. Like so: <center><table><tr><td> [ ALL THAT EPIC PROFILE CODE! ] </td></tr></table> (Reply to this) (Parent) (Thread)

	teamblake 2012-10-31 12:21 am UTC (link)
	Thank you so much for this! (Reply to this) (Parent)

	weedandlemonade 2012-11-12 05:48 am UTC (link)
	This is great, using it here! (Reply to this)

	(Anonymous) 2013-02-26 12:41 am UTC (link)
	Thanks♥ can't believe this is a profile code(ღ ˘ ⌣ ˘ ღ) it's so awesome anyway just tried it at my DreamWidth it seems to workヾ(@ ⌒ _ ⌒ @)ノ Oh Yeah!!! (Reply to this)

	fortheloveofpi 2013-03-20 04:47 pm UTC (link)
	argh this is amazing. Also, random fact - dunno where you pulled the map part from, but that's my hometown. I spend a lot of weekends wandering drunkenly up the road just there to a chipshop at the top of the Mile. <3 (Reply to this)

	Facebook Competition jerryholmes 2013-04-15 07:27 am UTC (link)
	It is essential for business owners to make great facebook profile. It is a great story telling tool that allows businesses to share more of their pre-Facebook era history, including historic photos, documents, and company milestones. Facebook Competition App (Reply to this)