Help With Friends/ Comments On A Div Options

[vivalajosho]

Sorry if i post to many topics...


...i just want to know how i can split the friends space and the comments so they can move around and not be in a scroll box...

..heres my code

CODE

<style>

body table {margin-top:100px;}
body td table, body div table {margin-top: 0;}

div.topbanner {position: absolute; top: 0; left: 50%; margin-top: 175px; margin-left: -398px; width: 800px; height: ####px;
}
div.Prices {position: absolute; top: 0; left: 50%; margin-top: 735px; margin-left: -380px; width: 755px; height: 145px; color: FFFFFF; font-family: time new roman; font-size: 20px; font-weight: bold; text-align:center; overflow: auto; padding: 4px;
}
div.PastWork {position: absolute; top: 0; left: 50%; margin-top: 1045px; margin-left: -378px; width: 755px; height: 510px; color: FFFFFF; font-family: arial; font-size: 12px; font-weight: bold; text-align: left; overflow: auto; padding: 4px;
}
div.nav {position: absolute; top: 0; left: 50%; margin-top: 825px; margin-left: -370px; width: 230px; height: 255px; color: FFFFFF; font-family: arial; font-size: 12px; font-weight: bold; text-align: left; overflow: auto; padding: 4px;
}
table, tr, td { background-color:transparent; border:none; border-width:0;}
body { background-color:000000;
background-image:url("http://img208.imageshack.us/img208/2827/backgroundbest.jpg");
background-attachment: fixed;
background-position: top;
background-repeat:repeat; }


table, tr, td, li, p, div { font-family:times new roman; color:FFFFFF; font-size:20px; }
.btext { font-family:arial; color:######; font-size:10px; font-weight:bold; }
.blacktext10 { font-family:arial; color:######; font-size:10px; font-weight:bold; }
.whitetext12 {color: ######; background-color: ######; background-image:url(); font-size: 10px; margin: 0px 0px 0px 0px; padding: 13px 10px 10px 10px; text-align: left; display: block; font-family: Helvetica, Arial; font-weight: bold;}
.blacktext12 {color: ######; font-size: 10px; background-color: ######; font-family: Helvetica, Arial, sans-serif; font-weight: normal; display: block; margin-top: 14px; text-transform: uppercase;}
.lightbluetext8 { font-family:arial; color:######; font-size:10px; font-weight:bold; }
.orangetext15 { font-family:arial; color:######; font-size:10px; font-weight:bold; }
.redtext { font-family:arial; color:######; font-size:10px; font-weight:bold; }
.redbtext { font-family:arial; color:######; font-size:10px; font-weight:bold; }
.text { font-family:arial; color:######; font-size:10px; font-weight:bold; }
a:active, a:visited, a:link { font-family:arial; color:######; font-size:10px; font-weight:bold; }
a:hover { font-family:arial; color:######; font-size:10px; }
a.navbar:active, a.navbar:visited, a.navbar:link { font-family:arial; color:######; font-weight:bold; }
a.navbar:hover { font-family:arial; color:######; font-size:10px; }
a.redlink:active, a.redlink:visited, a.redlink:link { font-family:arial; color:######; font-size:10px; font-weight:bold; }
a.redlink:hover { font-family:arial; color:######; font-size:12px; }
}
.friendspace {visibility:visible;width:397px; height:180px;position:absolute;
top:680px;left:415px;
overflow:auto;background-color:transparent;
border:black 0px solid;z-index:2px;}
}
.comments{visibility:visible;width:397px; height:180px;position:absolute;
top:680px;left:415px;
overflow:auto;background-color:transparent;
border:black 0px solid;z-index:2px;}
}


</style>






<div class="topbanner">

<img src="http://img40.imageshack.us/img40/8158/divlayoutdesign.jpg" />

</div>



<div class="Prices">
<p>
Regular Layout - $10<p>
Band Layout - $20<p>


</div>



<div class="PastWork">
Place Marker
</div>



</style>


<div class="friends" style="overflow:auto;width: 800px; height:740px; position: absolute; top: 1720px; margin-left:-510px;"><center><table><table><tr><td><table></center></div>

<div class="comments" style="overflow:auto; width: 600px; height:200px; position: absolute; top:600px; margin-left: -30px;"><center><table><table><tr><td><table></center></div>

thanks...

[Mikeplyts]

I don't really get what you mean but try finding this part:

CODE

.friendspace {visibility:visible;width:397px; height:180px;position:absolute;
top:680px;left:415px;
overflow:auto;background-color:transparent;
border:black 0px solid;z-index:2px;}
}
.comments{visibility:visible;width:397px; height:180px;position:absolute;
top:680px;left:415px;
overflow:auto;background-color:transparent;
border:black 0px solid;z-index:2px;}
}

and replace it with this:

CODE

.friendspace {visibility:visible;
width:397px;
height:180px;
position:absolute;
top:680px;
left:415px;
background-color:transparent;
border:black 0px solid;
z-index:2;}
}
.comments{visibility:visible;
width:397px;
height:180px;
position:absolute;
top:680px;
left:415px;
background-color:transparent;
border:black 0px solid;
z-index:2;}
}

Also, you should try messing with the top: and left: properties in that code snippet to try moving them where you want them.

[Mickey]

Replace the first code Mike posted with this instead:

CODE

.friendSpace {
visibility:visible;
width:397px;
position:absolute;
top:680px;
left:50%;
margin-left:200px;
background-color:transparent;
border:black 0px solid;
z-index:2px;
}
.friendsComments {
visibility:visible;
width:397px;
position:absolute;
top:880px;
left:50%;
margin-left:200px;
background-color:transparent;
border:black 0px solid;
z-index:2px;
}

To move them around, play with the top and margin-left attributes on each.

[Mikeplyts]

^Your code still has that 2px value for the z-index: property, though. Unless it's alright to be there?

Also, it has overflow:auto; in it, and didn't the OP want them to be non-scrollable?

[Mikeplyts]

Ah, ok. No problem.