The Blue Box

Designer's Comments

Look carefully for specific instructions

Make sure to replace all msplinks with the proper links provide right here in Createblog's forums. You will need to replace the "xxxxxx" after "FriendID=" with your own id.

Good luck and enjoy the layout!

Please feel free to e-mail me with any questions, comments or suggestion. I'm new to this so I'm looking to learn!

Using This Layout

For specific instructions read designer's comments

This is a div overlay layout, html knowledge required!
1. Log into myspace.com
2. Click on Edit Profile (Profile 1.0)
3. Copy (ctrl c) and paste (ctrl v) code to the specified fields

Update Friend ID

Input Friend ID to automagically update code

Layout Code

Copy and paste to About Me

Help

.flatline {clears default styles}
div, table, tr, td, tbody {background: transparent; border: 0;}

.flatline {hides left column, extended network and blogs}
.navigationBar, .profileInfo, .ImgOnlineNow, .contactTable, .userProfileURL, .interestsAndDetails, .userProfileDetail, .userProfileSchool, .userProfileNetworking, .userProfileCompany, .extendedNetwork, .latestBlogEntry {display: none;}

.flatline {hides words ABOUT ME and ID LIKE TO MEET}
.blurbs .orangetext15 {display: none;}

.flatline {hides top friends}
.friendSpace {display: none;}

.flatline {hides comments}

.flatline friendsComments {display: none;}

.flatline {hides bottom links and copyright}
table div div, table div font {display: none;} table table div div {display: block;} table table div font {display: inline;}

.flatline {fixes everything else}

.commentlinks, div table div embed, div table div object, table table table div {position: static; margin-left: 0px; height: auto; width: auto;}

.flatline {This is where your content divs are defined.}

.background {
background-color: black;
overflow:none;
position:absolute;
left:50%;
margin-left:-400px;
top:140px;
visibility:visible;
width:800px; height:600px;
border:2px white;
z-index: 2;
}

.aboutme {
background-color: transparent;
overflow:auto;
position:absolute;
left:50%;
margin-left:-345px;
top:270px;
visibility:visible;
width:300px; height:350px;
z-index: 3;
scrollbar-face-color : 43434B;
scrollbar-highlight-color : 15151F;
scrollbar-3dlight-color : 15151F;
scrollbar-shadow-color : 15151F;
scrollbar-darkshadow-color : 15151F;
scrollbar-track-color : 15151F;
scrollbar-arrow-color : 15151F;
padding: 5px;
padding-right: 10px;
}

.profpic {
background-color: transparent;
overflow:none;
position:absolute;
left:50%;
margin-left:110px;
top:445px;
visibility:visible;
width:135px; height:120px;
z-index: 4;
}

.profinfo {
background-color: transparent;
overflow:none;
position:absolute;
left:50%;
margin-left:110px;
top:568px;
visibility:visible;
width:138px; height:85px;
z-index: 4;
padding-left: 5px;
padding-right: 5px;
}

.friendpics {
background-color: transparent;
overflow:none;
position:absolute;
left:50%;
margin-left:41px;
top:225px;
visibility:visible;
width:270px; height:105px;
z-index: 4;
}

.comments{
position: absolute;
top: 740px;
left: 50%;
margin-left: -400px;
width: 800px;
background-color: white;
background-position: top center;
background-repeat: repeat-y;
overflow: auto;
z-index: 5;
}

.flatline {this is where you can edit your fonts}

p {color: 102D29; text-align: justify; text-indent: 5px; font-family: times, serif; font-size: 14px;}
p.center {text-align: center}
p.right {text-align: right}

i {color: 102D29; text-align: justify; text-indent: 5px; font-family: times, serif; font-size: 14px;}
i.small {color: 102D29; text-align: justify; text-indent: 5px; font-family: times, serif; font-size: 12px;}

b {font-family: times, serif; font: normal normal bold 14px times, serif; color: 102D29}
b.small {font-family: times, serif; font: normal normal bold 12px times, serif; color: 102D29}

h1 {font-family: times, serif; font-size: large; font-variant: small-caps; color: 2B4E4A; letter-spacing: 2px; text-transform: capitalize;}

h1.center {text-align: center;}

h2 {font-family: times, serif; font-size: medium; font-variant: small-caps; color: 2B4E4A; text-transform: capitalize;}
h2.center {text-align: center}

a {color: 000000}

body table tr table tr td.text table tr td.text table tr td table tr td {font-size: 14px; font-family: times, serif; color: A8A8A8; text-align: justify;}

</style>

</div>

<p>
Put whatever you like in this section. Videos, a blog, some pictures and whatever else strikes your fancy. Below are examples of different types of text you can use.
</p>
<p>This box will keep expanding as you add more so no worries! What fun! Ho! Ho! Ho!
</p>
<hr>
<p>This is normal text</p>
<p class="center">This is centered normal text</p>

<i>This is italic text</i>
<br>
<i class="small">This is smaller italic text.</i>
<br>
<b>This is bold text.</b>
<br>
<b class="small">This is smaller bold text.</b>
<br>
<h1>This is a heading.</h1>
<h1 class="center">This is a centered heading.</h1>
<h2>This is a small heading.</h2>
<h2 class="center">This is a small centered heading.</h2>

</div>

<div class="profinfo">
<b class="small">Name:</b><i class="small">Your name here.</i>
<br>
<b class="small">Age:</b><i class="small">Your age here.</i>
<b class="small">Sex:</b><i class="small">Your sex here.</i>
<b class="small">Location:</b><i class="small">Your Location here.</i>
<br>

</div>

</marquee>

</div>

</td></tr></table>
</td></tr></table>

Layout Comments

Showing latest 10 of 39 comments

AMAZING DETAIL.

By Butterface89 on Sep 29, 2010 8:21 pm

Took me hours on end, but I figured it out :]] I love this layout! Check it out! myspace.com/myusik_iz_lyfe

By Punkinfacer on Nov 20, 2008 7:52 am

you need to put the xxxxxx because they are not there
need to fix it

By spiderpig on May 23, 2008 10:38 am

This is the best layout that I've seen anywhere! I've been showing it to everyone! I can't find where to input my Friend ID #. How do I customize it for me?

By Cali-Chan on May 13, 2008 8:40 pm

I'm having an incredibly hard time finding the xxxxxx where my id goes, and also, when I put it on my profile and click on 'view friends', I get somebody elses friends! I love this layout, and I am not dumb on the computer, but it is cunfusing the heck out of me! Help???

By swimchickmle on May 8, 2008 12:17 am

can someone please help??
i have no idea how to put all my details in or anything please help coz i love this layout!!!

By xx-sAiRz-xx on May 4, 2008 4:13 am

i love this layout!

By piababii on May 3, 2008 11:28 pm

i love this layout!

By piababii on May 3, 2008 11:28 pm

how do i remove the 'who id like to meet' part below the layout?

By brokenhalo on Apr 22, 2008 12:48 am

awesome layout btw :)

By adf06 on Apr 5, 2008 7:53 pm

View all »

Layout Details

Designer	FlatlineProductions2008
Submitted on	Mar 22, 2008
Page views	57,519
Favorites	420
Comments	39
Reviewer	agiri
Approved on	Mar 22, 2008

The Blue Box

Designer's Comments

Using This Layout

Update Friend ID

Layout Code

Layout Comments

Layout Details

Layout Tags

Layout Tools

Layout Affiliates