div comments - alter width of comment text Options

[falsetigerlimbs]

I'm currently using a DIV overlay layout. I managed to place my comments into a DIV layer, but for some reason the actual comment itself is still too long. I can alter the width of the date and time table, but not the text below it. Also, I can't get the comments to appear close to the edge of the DIV; there is a huge gap at the top.

The link to my myspace: http://www.myspace.com/britgal858
(You will see the comment DIV hovering on the left side)

This is the related code from my About Me section:

CODE

{comment coding}
{hides: friends space and span text; unhides: actual comments;}
.comt td td td table, .btext, .orangetext15, .redlink {display:none;}
.comt td td td {visibility:visible; background-color:transparent !important; border:0px; width:290px;}
{ the: MAIN comt div;}
.comt {
visibility:visible;
z-index:1;
width: 300px; height: 300px;
position:absolute;
top: 2px; left: 2px;
overflow: auto;
background-color: transparent;}
table table table {width:300px;}
table table table table table table {width:20%;}


.comt td, .comt table{width:0px!important; height:0px!important; background-color:transparent!important; border:0px!important; padding:2px!important; } .comt, .comt td, .comt table, .comt td a img, .comt td td td a, .comt td b a, .comt td .redlink{visibility:visible;}
.comt td td td b{top:0px; display:inline;}
.comt td td td table, .comt .orangetext15, .redlink, .comt .btext, .rid, .frnd{display:none;}
.comt {z-index:7;}
.comt table, .comt b {position:relative; top:10px; _top: 2px; width: 290px;}
{comment LINKS and time stamp}

.comt td a {font-family: verdana; font-size: 11px; color: 666666;}
.comt td a:hover {font-family: verdana; font-size: 11px; color: 000000;  font-weight: bold; text-decoration: underline;}

.blacktext10 {width: 200px; font-family: Georgia; font-size: 11px; color: 000000; font-weight: normal; display: block; background-color: CFCFCF; }
{hides: Displaying XX of XX comments(View/Edit All Comments);}
.comt td b{display:none;}
.nametext {width: 100px; display:block;}

{resizes: linked images including friends profile pic;}
.comt td a img {width:90px; max-width:70px; width:auto; _width:90px !important;}

Any help with this issue would be greatly appreciated.

[coldtrance]

here try using the shrink image code:
http://www.createblog.com/forums/index.php?showtopic=124161

^it makes the extra space in the table smaller and wil force your text to move to the next line. example:

before:
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

after:
aaaaaaaa
aaaaaaaa
aaaa

and to position the layer look for this:
{ the: MAIN comt div;}
.comt {
visibility:visible;
z-index:1;
width: 300px; height: 300px;
position:absolute;
top: 2px; left: 2px;
overflow: auto;
background-color: transparent;}
table table table {width:300px;}
table table table table table table {width:20%;}

you need to change those numbers that i put in bold. try making the "top:2px" into a large negative number