Friends and Comments Side by Side Center Bottom

Friends and Comments Side By Side Bottom Center

i.e. like this:


This solution assumes the following:
1) NO Calendar Displayed (if you do have one, it will show up above the comments, with the comments below it).
2) You do NOT have a video displayed, below the "to meet" section. (This is the myspace default location for video placement).
3) Your Friend section is SHORTER than your Comment section.
4) Your table layer structure has not been modified (via the closing and opening of tables). If you have other code which closes and/or opens tables this MAY not work. it depends on how well balanced you solution is.

Remove any other code you have for changing the position of the friends and/or comments. You do not need to remove style code which modifies the coloring or fonts.

This solution has the following features:
1) Comments and Friends place directly below your other content, and above the bottom links/cc stuff.
2) There is no need to adjust px values, either based on your profile, or as you add additional content
3) This works with multiple browsers and resolutions.
4) The div, containing the friends and comments self sizes, based on the width of the viewers page
5) You can alter the percent values, if you want the friend section narrower than the comment section, or the other way around.

Will we ever encounter a situation which causes overlap?
Yes, The friends and comments, may overlap in the center, if the viewers page is to narrow. However, if they widen the page, the friends and comments will re-adjust themselves. IE does not allow percent sizing for images and objects, so I had to choose a size.

Place this code at the bottom of the "who I'd Like To Meet Section":

<span class="off">!-Start Code for Side by Side Friends and Comments-!</span>
<style>
div.mydclassfc {position:relative; top:0px; width:100%; }
div.mydclassfc table.friendspace {width:50% !important; position:absolute; top:0px; right:0px;}

{!-size and position comments; -!}
.friendscomments {width:49.5% !important; }
.friendscomments td, .friendscomments table, .friendscomments table td {width:100%}

{!-Change border px size to 0 if you do not want a border around your comments;
  or if you only want a line separating comments change border to border-bottom -!}
.friendscomments table table td {border:1px silver solid !important; margin:1px; width:auto !important}

{!keep friend space limited to the width of right side;
   control width and height a friend picture can take !}
.friendspace img {max-width:96%; _width:80px;}
.friendspace td, .friendspace table {width:100% !important;}
.friendspace table table td {width:25% !important;}
.friendspace table table table  { width:100% !important; height:165px !important; padding:0px; margin:0px; }

{!-control size of images and objects in comments-!}
.friendscomments a img {max-width:100%; _width:95px;}
.friendscomments img, .friendscomments object {max-width:100%; _width:250px;}

{!-align top of comments with top of div by removing br -!}
div.mydclassfc br {display:none;}
div.mydclassfc table br {display:inline;}

table.mytclassfc {width:99% !important; margin-left:9px;}

</style>

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

<table class="mytclassfc" ><tr><td>
<table style="width:100%" ><tr><td>
<div class="mydclassfc">

<table style="display:none"><tr><td>
<table style="display:none"><tr><td>
<span class="off">!-END Code for Side by Side Friends and Comments=!</span>

Band Page Code
While the above code does work on the band page, the below code is optimized for the band page.
I also switched the friends and comments, so the friends are now left, and the comments right.
Place this code at the bottom of the Bio section:

<a class="i http://xiii.us" href="http://www.msplinks.com/MDFodHRwOi8veGlpaS51cy9tcy9mcmllbmRzQ29tbWVudHMtc2lkZUJ5U2lkZQ==">
Side By Side Friends And Comments Code by Eileen</a>
<style>
.i {display:none;}
div.mydclassfc {position:relative; top:0px; width:100%; height:auto;}

{! determine how much of the available width friendSpace should take !}
div.mydclassfc table.friendsParentTable {width:49% !important; position:absolute; top:0px; left:0px; }

{! sum of above and below percent should be just under 100.  If you change the below percent width, also change the left percent to about the same !}

{!-size and position comments; -!}
.friendscomments {width:49% !important; position:relative; left:50% }
.friendscomments td, .friendscomments table, .friendscomments table td {width:100%}

{!-Change border px size to 0 if you do not want a border around your comments;
  or if you only want a line separating comments change border to border-bottom -!}
.friendscomments table table td {border:1px silver solid !important; margin:1px; width:auto !important}

{!keep friend space limited to the width of right side;
   control width and height a friend picture can take.
   You may want to make your friendSpace even smaller. !}
.friendspace img {max-width:96%; _width:80px;}
.friendspace td, .friendspace table {width:100% !important;}
.friendspace table table td {width:25% !important;}
.friendspace table table table  { width:100% !important; height:165px !important; padding:0px; margin:0px; }

{!-control size of images and objects in comments-!}
td.columnsWidening img, td.columnsWidening a img, td.columnsWidening object, td.columnsWidening embed {max-width:100%; _width:260px;}
{!if you choose to allow enough space for a 400px width comment content you do NOT need the above, and can avoid the IE issue with needing to enlarge tiny images!}

{!-align top of comments with top of div by removing br -!}
div.mydclassfc br {display:none;}
div.mydclassfc table.friendSpace br,
div.mydclassfc table.friendsComments br {display:inline;}

table.mytclassfc {width:99% !important; margin-left:5px;}

</style>

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

<table class="mytclassfc" ><tr><td>
<div class="mydclassfc">
<table><tr><td>

<table class="friendsParentTable" ><tr><td>
<table style="display:none"><tr><td>
<table style="display:none"><tr><td>

<span class="off">!-END Code for Side by Side Friends and Comments=!</span>

If you want to re-size your friendSpace further, to allow more room for your comments, see this article:
Friend Space sizing and Styling

Thank you for Visiting, Have a Nice day


music player skin showing up in about me and top of page and interests
add color background to mini myspace music player
nature themed skins
abstract myspace music player skins
celebrity myspace music playerthemed skins
cd album art myspace themed skins
plain myspace music player skins
emo myspace music player skin
skull myspace music player skins
myspace music box skins
jonas brothers myspace music player skins
pink myspace music player skins
green myspace music player skins
hide add song on myspace music player
custom myspace music player skins
skin your myspace music player