Myspace Div Overlay Comments Options

[hadesmod]

Hi I have a problem getting my div overlay test page to display comments in a section I added on my profile. I have 2 comments on it, I had my other profile post one, and my friend posted one for me.

I'm using a test profile to test the layout with..

My Layout is: My Myspace

My code is:

ABOUT ME

CODE

<style type="text/css">

.main {
position: absolute;
left: 40%;
top: 153px;
width: 900px;
z-index: 1;
margin-left: -400px;
letter-spacing: normal;
background-color: 0D0D49;
}

body {
background-color: 0d0d49;
}
.header {
color: FFFFFF;
background-color: 000000;
font-size: 18px;
font-style: normal;
font-weight: bold;
font-variant: normal;
text-transform: uppercase;
border-color:FFFFFF;
border-style:solid;
border-width:1px;
}
.navtext {
font-size:14px;
color: FFFFFF;
font-weight: bolder;
font-style: normal;
text-decoration: none;
background-color: 000000;
font-family: Georgia, "Times New Roman", Times, serif;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 7px;
padding-left: 5px;
border-color:990000;
border-style:solid;
border-width:1px;
}
.navtext a {
text-decoration: none;
border:none;
}
.navtext a:link {
color: ffffff;
}
.navtext a:hover, .navtext a:active {
color: FF0000;
text-decoration: underline;
}
.style2 {text-decoration: none; background-color: 000066; padding: 5px; font-size: 14px; color: FFFFFF;}
</style>




<style type="text/css">

.contactTable, .lightbluetext8, td.text td.text table {display: none}

.comt a img, .comt td td td a, .text, {display: table}
table table, table table td {padding: 0px; height: 0px}

a:link, a:visited, a:hover {
color: blue;
font-weight: normal;
font-size: 10px;
font-family: "Microsoft Sans Serif";
text-decoration: none}
a:hover { text-decoration: underline}


.SECTION{: My Styles }

.notetomyself{: hides friends space and span text and unhides actual comments }
.comt td td td table, .btext, .orangetext15, .redlink{ display: none}
.comt td td td { visibility: visible; background-color: FFFFFF !important; border: 0px; width: 250px}

.notetomyself{: the MAIN comt div }
.comt {
visibility: visible;
width: 539px; height: 323px;
position: absolute;
top: 674px; left: -13px; margin-left: 23px;
overflow-x: hidden;
overflow-y: scroll;
background-color: FFFFFF;
z-index: 3}

.notetomyself{: fills the empty space at the top. (the width of this should always be about 50px less than the MAIN comt div) }
.comt table {
visibility: hidden; height: 0px;
width: 15px; z-index: 4}

.notetomyself{: always keep this 10px less than the above code }
* html .comt table { top: -25px !important}


.SECTION{: Text styles }

.notetomyself{: comment date (the width should be around 130px less than the main comt div) }
.blacktext10 {
background-color: DCEBF3;
color: 000;
display: block;
width: 220px;
height: 13px;
padding-top: 2px}


.notetomyself{: lowers comment date box }
.blacktext10 {
font-family: "Microsoft Sans Serif";
font-size: 10px;
color: black;
text-indent: 12px;
position: relative; top: 20px;
font-weight: normal;
margin-bottom: 4px}

.notetomyself{: style of all text in comments }
.comt td td td, .comt td td td b {
font-family: "Microsoft Sans Serif";
font-size: 9px;
font-weight: normal;
color: black;
line-height: 10px;
padding-left: 5px;
padding-bottom: 5px;
width: 218px}

.notetomyself{: style of all links in comments and friend name ;
.comt td td td a {
font-family: "Microsoft Sans Serif";
font-size: 10px;
color: blue;
font-weight: normal;
text-decoration: none}

.comt td td td a:hover {
font-family: "Microsoft Sans Serif";
font-size: 10px;
color: blue;
font-weight: normal;
text-decoration: underline}


.SECTION{: Text and IMG Resize }

.notetomyself{: resize images posted in comments. (use same width as: blacktext10) }
.comt img { width: 90px; max-width: 90px}
.NOTE{: IE FIX }
* html .comt img { width: 90px}

.notetomyself{: resize linked images including friends profile pic }
.comt a img { width: 90px; max-width: 90px}
.notetomyself{: IE FIX }
* html .comt a img { width: 90px}

.notetomyself{: resize/hide 'Online Now' image }
.comt div img, .comt td td td div { width: 0px; display: none}

.notetomyself{: add line comment devider }
.comt td td td { border-bottom: 1px solid; border-color: CCCCCC}

.notetomyself{: hides friends 'Online Now' image }
</style>

WHO ID LIKE TO MEET:

CODE

<body>


<div class="main">

<table border="1" style="width: 1000px;
height: 800px;
cellpadding: 0px;
cellspacing: 0px;
background-color: 0D0D49;">
<tr>
<td width="766" height="330" valign="top"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="660" width="766" align="absmiddle" data="http://hades.110mb.com/space.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://hades.110mb.com/space.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="0d0d49" />
</object></td>
<td width="218" valign="top"><table width="218" height="218" border="0">
<tr>
<th scope="col"><div align="center" class="header">Navigation</div></th>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Home</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Add Me To Friends</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Send Me A Message</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Send Me A Comment</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">View All My Pics</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">View All My Comments</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">View All My Friends</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
</table></td>
</tr>
<tr>
<td height="330" colspan="2" valign="top">
<table width="986" height="284" border="0">
<tr>
<th width="542" scope="col"><div class="comt"></div></th>
<th width="434" scope="col"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="270" width="435" style="width:435px; visibility:visible; height:270px;" border="0" data="http://www.musicplaylist.net/mc/mp3player.swf?tomy=http://www.musicplaylist.net/mc/config/config_red.xml&mywidth=435&myheight=270&file=http://www.musicplaylist.net/loadplaylist.php?playlist=24811085">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://www.musicplaylist.net/mc/mp3player.swf?tomy=http://www.musicplaylist.net/mc/config/config_red.xml&mywidth=435&myheight=270&file=http://www.musicplaylist.net/loadplaylist.php?playlist=24811085" />
<param name="menu" value="false" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
</object>
</th>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2" valign="top"><p> </p>
<p> </p></td>
</tr>
</table>

</div>

</body>

If anyone can tell me what's wrong, let me know ;) Thanks!

[freeflow]

I used codeboxes so make sure you copy the entire things...and read the bottom of the post (:

ABOUT ME

CODE

<style type="text/css">

.main {
position: absolute;
left: 40%;
top: 153px;
width: 900px;
z-index: 1;
margin-left: -400px;
letter-spacing: normal;
background-color: 0D0D49;
}

body {
background-color: 0d0d49;
}
.header {
color: FFFFFF;
background-color: 000000;
font-size: 18px;
font-style: normal;
font-weight: bold;
font-variant: normal;
text-transform: uppercase;
border-color:FFFFFF;
border-style:solid;
border-width:1px;
}
.navtext {
font-size:14px;
color: FFFFFF;
font-weight: bolder;
font-style: normal;
text-decoration: none;
background-color: 000000;
font-family: Georgia, "Times New Roman", Times, serif;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 7px;
padding-left: 5px;
border-color:990000;
border-style:solid;
border-width:1px;
}
.navtext a {
text-decoration: none;
border:none;
}
.navtext a:link {
color: ffffff;
}
.navtext a:hover, .navtext a:active {
color: FF0000;
text-decoration: underline;
}
.style2 {text-decoration: none; background-color: 000066; padding: 5px; font-size: 14px; color: FFFFFF;}
</style>




<style type="text/css">

.contactTable, .lightbluetext8 {display: none}

.comt a img, .comt td td td a, .text, {display: table}
table table, table table td {padding: 0px; height: 0px}

a:link, a:visited, a:hover {
color: blue;
font-weight: normal;
font-size: 10px;
font-family: "Microsoft Sans Serif";
text-decoration: none}
a:hover { text-decoration: underline}


.SECTION{: My Styles }

.notetomyself{: hides friends space and span text and unhides actual comments }
.comt td td td table, .btext, .orangetext15, .redlink{ display: none}
.comt table {
visibility: hidden; height: 0px;
width: 15px; z-index: 4}
.comt td td td { visibility: visible; background-color: FFFFFF !important; border: 0px; width: 250px}

.notetomyself{: the MAIN comt div }
.comt {
visibility: visible;
width: 539px; height: 323px;
position: absolute;
top: 674px; left: -13px; margin-left: 23px;
overflow-x: hidden;
overflow-y: scroll;
background-color: FFFFFF;
z-index: 3}

.notetomyself{: fills the empty space at the top. (the width of this should always be about 50px less than the MAIN comt div) }

.notetomyself{: always keep this 10px less than the above code }
* html .comt table { top: -25px !important}


.SECTION{: Text styles }

.notetomyself{: comment date (the width should be around 130px less than the main comt div) }
.blacktext10 {
background-color: DCEBF3;
color: 000;
display: block;
width: 220px;
height: 13px;
padding-top: 2px}


.notetomyself{: lowers comment date box }
.blacktext10 {
font-family: "Microsoft Sans Serif";
font-size: 10px;
color: black;
text-indent: 12px;
position: relative; top: 20px;
font-weight: normal;
margin-bottom: 4px}

.notetomyself{: style of all text in comments }
.comt td td td, .comt td td td b {
font-family: "Microsoft Sans Serif";
font-size: 9px;
font-weight: normal;
color: black;
line-height: 10px;
padding-left: 5px;
padding-bottom: 5px;
width: 218px}

.notetomyself{: style of all links in comments and friend name ;
.comt td td td a {
font-family: "Microsoft Sans Serif";
font-size: 10px;
color: blue;
font-weight: normal;
text-decoration: none}

.comt td td td a:hover {
font-family: "Microsoft Sans Serif";
font-size: 10px;
color: blue;
font-weight: normal;
text-decoration: underline}


.SECTION{: Text and IMG Resize }

.notetomyself{: resize images posted in comments. (use same width as: blacktext10) }
.comt img { width: 90px; max-width: 90px}
.NOTE{: IE FIX }
* html .comt img { width: 90px}

.notetomyself{: resize linked images including friends profile pic }
.comt a img { width: 90px; max-width: 90px}
.notetomyself{: IE FIX }
* html .comt a img { width: 90px}

.notetomyself{: resize/hide 'Online Now' image }
.comt div img, .comt td td td div { width: 0px; display: none}

.notetomyself{: add line comment devider }
.comt td td td { border-bottom: 1px solid; border-color: CCCCCC}

.notetomyself{: hides friends 'Online Now' image }
</style>

I'd like to meet

CODE

<div class="main">

<table border="1" style="width: 1000px;
height: 800px;
cellpadding: 0px;
cellspacing: 0px;
background-color: 0D0D49;">
<tr>
<td width="766" height="330" valign="top"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="660" width="766" align="absmiddle" data="http://hades.110mb.com/space.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://hades.110mb.com/space.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="0d0d49" />
</object></td>
<td width="218" valign="top"><table width="218" height="218" border="0">
<tr>
<th scope="col"><div align="center" class="header">Navigation</div></th>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Home</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Add Me To Friends</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Send Me A Message</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Send Me A Comment</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">View All My Pics</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">View All My Comments</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">View All My Friends</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
<tr>
<td><div align="center" class="navtext"><a href="#" class="navtext">Link</a></div></td>
</tr>
</table></td>
</tr>
<tr>
<td height="330" colspan="2" valign="top">
<table width="986" height="284" border="0">
<tr>
<th width="542" scope="col"><div class="comt"></div></th>
<th width="434" scope="col"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="270" width="435" style="width:435px; visibility:visible; height:270px;" border="0" data="http://www.musicplaylist.net/mc/mp3player.swf?tomy=http://www.musicplaylist.net/mc/config/config_red.xml&mywidth=435&myheight=270&file=http://www.musicplaylist.net/loadplaylist.php?playlist=24811085">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://www.musicplaylist.net/mc/mp3player.swf?tomy=http://www.musicplaylist.net/mc/config/config_red.xml&mywidth=435&myheight=270&file=http://www.musicplaylist.net/loadplaylist.php?playlist=24811085" />
<param name="menu" value="false" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
</object>
</th>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2" valign="top"><p> </p>
<p> </p></td>
</tr>
</table>

</div>
<div class="comt"><table><tr><td><table><tr><td>

You just need to position your comments where you want them, and edit your CSS so the background isn't white and blends in.