Comment Box In A DIV Options

[crosseyed]

Hey,

Im working on a layout for a friend, and i cant figure out how to get the comments to display in one area, and the actual comment box in another area. All the codes I try end up putting the comment box in the same DIV as the comments themselves.

I want the comment box in the right box, and the comments to display in the div area i already made.

www.myspace.com/profiletest850

[digitalfragrance]

Could you please post your current coding?

[crosseyed]

CODE

<style type="text/css">
table table,table table table table,table table{background-color:transparent;width:;border:0px;}
div,table,tr,td,th{background-color:transparent;text-align:left;border:0px;}
a.navbar,font,.whitetext12,.btext,.orangetext15,
.redbtext,.redtext,.blacktext12,.blacktext10,
.lightbluetext8,strong,.nametext,div b font font,
div font font u,table table table table, table.contacttable{display:none;}
div table form tr td,td.text table,a.text, table div font a,table div div,{visibility:hidden;di-splay:none}
table td table tr td.text table {visibility:hidden;}
table td table tr td.text table table, table td table tr td.text table table td.text {visibility:visible;}
td.text table table {display:inline; visibility:visible;}
embed{position:absolute;top:0px;left:0px;display:block;width:0px; height:0;}
</style>

<style type="text/css">
.mycomments {height:600; overflow:auto; width:498px;}
.friendspace {position:absolute; margin-top:-600px;}
</style>



<div class="bg" style="position: absolute; left:200px; top:160px; width:819px; height:1092px; overflow: hidden;">
<img src="http://img131.imageshack.us/img131/6813/kopinskispacenx2.jpg" border="0" usemap="#nav">
<map name="nav">
<area shape="rect" coords="120,253,172,265" href="http://www.msplinks.com/MDFodHRwOi8vbWFpbC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1tYWlsLm1lc3NhZ2UmZnJpZW5kSUQ9MTgwMTkxMjcw" alt="mail">
<area shape="rect" coords="192,253,255,265" href="http://www.msplinks.com/MDFodHRwOi8vY29sbGVjdC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJRD0yODMxMzE5ODM=" alt="friend">
<area shape="rect" coords="277,253,308,265" href="http://www.msplinks.com/MDFodHRwOi8vY2hhdC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1tZXNzZW5nZXImc3RyRGVzdGluYXRpb25Vc2VySUQ9MjgzMTMxOTgzJnNlbmRUeXBl
TA=" alt="im">
<area shape="rect" coords="334,253,394,265" href="http://www.msplinks.com/MDFodHRwOi8vZ3JvdXBzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPWdyb3Vwcy5hZGR0
2dyb3VwJmZyaWVuZElEPTI4MzEzMTk4Mw==" alt="group">
<area shape="rect" coords="414,253,504,265" href="http://www.msplinks.com/MDFodHRwOi8vbWFpbC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1tYWlsLmZvcndhcmQmZnJpZW5kSUQ9MjgzMTMxOTgzJmY9Zm9yd2FyZHByb2ZpbGU=" alt="forward">
<area shape="rect" coords="523,253,608,265" href="http://www.msplinks.com/MDFodHRwOi8vY29sbGVjdC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLmFkZFRvRmF2b3JpdGUmZnJpZW5kSUQ9MjgzMTMxOTgzJnB1YmxpYz0w" alt="favorite">
<area shape="rect" coords="628,253,678,265" href="http://www.msplinks.com/MDFodHRwOi8vY29sbGVjdC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1SYXRlSW1hZ2UuVXNlclJhdGluZyZVc2VySUQ9MjgzMTMxOTgz" alt="rate">
<area shape="rect" coords="702,253,765,265" href="http://www.msplinks.com/MDFodHRwOi8vY29sbGVjdC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1ibG9jay5ibG9ja1VzZXImdXNlcklEPTI4MzEzMTk4Mw==" alt="block">
</map>
</div>

CODE

<div class="mycomments" style="overflow:auto; width: 498px; height:188px; position: absolute; top:1041px; left: 264px;"><center><table><table><td><table></center></div>

[digitalfragrance]

Okay, you need to add another DIV layer, and post your comment code within that layer, like this:

CODE

<div style="position: absolute; overflow:auto; left: ##px; top: ##px; width: ##px; height: ##px;">
Comment Box Code Here

</div>

Make sure to insert numbers where the "##" are to govern the position and size of the div layer.

[crosseyed]

I added this code, and its still appearing above the comments, instead of in the area i want it to.

CODE

<div style="position: absolute; overflow:auto; left: 364px; top: 1041px; width: 200px; height: 188px;">
<form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment"><input name="friendID" value="MYFRIENDID" type="hidden"><textarea name="f_comments" style="width: 200px; height: 188px;" cols="10" rows="7" style="border-width: 1px; border-style: solid; border-color: 000000; font-family: small fonts; text-transform:uppercase; letter-spacing:1pt;font-size: 7px; color: 000000; background-color: ffffff;" style="overflow:auto;">HEY </textarea>
<br> <input value="SUBMIT" style="border-width: 1px; border-style: solid; border-color: 000000; width:75px; font-family: small fonts; text-transform:uppercase; letter-spacing:1pt; font-size: 7px; color: 000000; background-color: ffffff;" type="submit"> <input value="RESET" style="border-width: 1px; border-style: solid; border-color: 000000; width:75px; font-family: small fonts; text-transform:uppercase; letter-spacing:1pt;font-size: 7px; color: 000000;  background-color: ffffff;" type="reset"></form>
</div>

[digitalfragrance]

Did you place the div layer above the comment DIV in your layout code?

[crosseyed]

yes
___EDIT____
Nvm... i didnt realize it mattered what order the divs were listed in >_<

Thanks :)

[S-Majere]

Sorted.

Topic Closed.