myspace 2.0 skinny profile
This may be the one task, I have found, that is not easier in myspace 2.0 then it was in version 1.
However, it is still reasonable to do.
IF you want the profile skinnier then 720px (the width of the ad banner), unless you are willing to keep the entire top area, sized to at least 720px wide, you need to do a "pick up and plop" (otherwise known as absolute positioning) with the top ad banner.
The following code block makes the profile 550px wide, including the top menu and search area.
Place this code into the css area of the customizing section (select customize profile from the profile menu, then select css).
I HIGHLY recommend applying a music player skin, or at least resizing the player, to fit into the narrow column.
You can get the code to resize and/or apply a skin to the music player here:
myspace 2.0 music playlist music player skins, resize, and position player code
You may also want a skinny contact table, you will find the code for that here:
myspace 2.0 custom contact tables, resize contact table
However, it is still reasonable to do.
IF you want the profile skinnier then 720px (the width of the ad banner), unless you are willing to keep the entire top area, sized to at least 720px wide, you need to do a "pick up and plop" (otherwise known as absolute positioning) with the top ad banner.
The following code block makes the profile 550px wide, including the top menu and search area.
Place this code into the css area of the customizing section (select customize profile from the profile menu, then select css).
{! skinny profile 550px wide code by Eileen !}
ul#rightNav, ul#leftNav {border-right:0px;}
div#leaderboard {position:absolute; top:0px; right:50%; margin-right:-370px}
h2#mslogo.global {display:none}
div.wrap {width:550px; margin-right:auto; margin-left:auto; margin-top:90px;}
div#header {background-color:transparent;}
div#googlebar {background: transparent url(''); width:550px; height:50px; position:relative; margin-top:-10px; _margin-top:-15px; margin-right:auto; margin-left:auto; border:3px green dashed;}
form#formSearch_Header { margin-left:auto; margin-right:auto}
div#googlebar div.global {position:absolute; top:0px; left:36px;}
div#topnav {background:transparent; border:0px; width:550px; }
ul#leftNav li,
ul#rightNav li {background-color:transparent; width:auto; margin:0px; padding:0px; border:0px;}
ul#leftNav li *,
ul#rightNav li * {color:black; font-size:8px; font-family:comic sans ms; font-weight:bold; margin:0px; padding:0px; border:0px;}
I HIGHLY recommend applying a music player skin, or at least resizing the player, to fit into the narrow column.
You can get the code to resize and/or apply a skin to the music player here:
myspace 2.0 music playlist music player skins, resize, and position player code
You may also want a skinny contact table, you will find the code for that here:
myspace 2.0 custom contact tables, resize contact table
posted by u∃∃l!∃ at Friday, December 26, 2008
7 Comments:
Do you know if there is a way to make the space between the modules smaller? ( I think in 1.0 you could do: br {line-height: 5px;} or something like that I think) Thanks for any ideas you have, you are amazing!
In 2.0 they are using margins and padding instead of the br element, to create the space.
A lot of it can be removed by changing the margin applied to div.module (one of the class names used for all of the modules)
div.module {margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:0px;}
You can change the 0 to 1 or whatever value you want there.
They are using 5, and with 5px padding, and 5px margin, at the top and bottom of each module, that is 20px of space, between modules.
There may also be some space taken up by the empty div elements, which are at the top and bottom of each module.
hi uhm i seen on a couple of peoples pages that there profile width changes to what ever size the internet window is so like when you make the window small the profile width gets smaller to and when you make the window bigger the profile width gets bigger. so how do you do that?
by setting the width to 100%, and then setting the column widths to some percent as well.
But for me to determine all the elements, that need the width setting, to make it work, would require I go in and do some testing.
OR
in myspace 2.0, you can just choose to make the profile width 100%, they are already using percent sizing for most of the profile elements.
I'm not exactly sure what you mean by the pick and plop method to reside the top banner. I've never done that before. Would you be able to post about how to do that to match the width of the skinny profile?
Thank you for your time.
PS: Your blog is so helpful!
when i i put the skinny code on and i put oon my layout it jus goes baq to 720 width idk qwhat to duh ?? ode plzzz
i Think its To Small is it was bigger it Would of been Better beucase The Center is All Small & shit But then The Outside is Big . It kind Does Look Riqht So Yeah Add mee . myspace.com/Sidekicko8freak
Post a Comment
Due to Excessive Spam, I have turned on comment moderation.
Links to this post:
Create a Link
<< Home