How do I put a comment box on my layout?, Or put all of my comments into a scrollbox div thingy Options

[n-murray]

I think i'm going to be able to figure this out, what I'm experimenting on is only showing the comment box, and moving that around/editing it.

Hi I'm trying to put a comment box onto my page but when I put one on, it moves when you go on a computer with a different screen size. Can someone help me put one on my page?

Or another option for me that I like just as much is to put all of my comments into a scrollbox and be able to move it. I tried this:

CODE

#comments{position: absolute; left: 100%; margin-left: 400px; top: 0%; margin-top: 50px; width: 400px; height: 75px;}

but the thing only moves up and down, it doesn't move to the left or resize itself and go in a scrollbar.

Here is my coding (comment box version):

CODE

<style type="text/css">
#profile div#stats{display:none !important;}
#profile div#splash{display:none !important;}
#profile div#bestfriends {display:none!important;}
#profile div#aboutme {display:none !important;}
#profile div#contactme {display:none!important;}
#profile div#links{display:none!important;}
#profile div#recententries {display:none!important;}
#profile div#favorites {display:none !important;}
#profile div#submissions {display:none !important;}
#profile div#skills {display:none !important;}
#profile div#recentphotos{display:none !important;}
#profile div#comments{display:none !important;}

textarea { background-color: transparent; font-family:georgia; font-size:12px; color: #c1c1c1; width:651px; height:30px; border-right: 0px transparent; border-top: none; border-bottom: 0px transparent; border-left: 0px; overflow:hidden; position:absolute; overflow:auto; top:0px;
left:30%; margin-left:293px;}

.button { background-color:#eeeeee; font-family:small fonts; font-size:7px; text-transform:uppercase; color: white; width:653px; height:18px; padding: 2px; border: none; position:absolute; overflow:auto; top:5px;
left:30%; margin-left:293px;}

#commenteras { position: absolute; left: 213px; top: 30px; text-align: center; font-family:georgia; font-size:9px; color: white; z-index: 1 }

body { cursor:crosshair; }

a, a:link {
color:15b2e0;
text-decoration:none;
}

a:hover {
color: #ffce81;
text-decoration:overline;
cursor:all-scroll;
}

#info {
font-family: Gill Sans MT; font-size: 16px; color:#c1c1c1;
background-color:transparent; border:0px solid;
border-color:none; width:958px; height:75px;
position:absolute; overflow:auto; top:116px;
left:50%; margin-left:-478px;
}

#link {

font-family: small fonts; text-transform:uppercase; font-size: 8px; color:#c1c1c1;
background-color:transparent; border:0px solid;
border-color:none; width:958px; height:20px;
position:absolute; overflow:auto; top:60px;
left:50%; margin-left:-220px;
}

#profile div#footer{display:none !important;}
#profile div#comments{visibilty: visible;}
#headhoncho{position: absolute; left: 50%; margin-left: -30px; top: 0%; margin-top: 10px; width: 300px; height: 500px;}
#profile div#comments{position: absolute; left: 50%; margin-left: 150px; top: 0%; margin-top; 0px; width: 400px; height: 600px;
</style>
<div style="top:115px; left:50%; margin-left:-480px; position:absolute;">
<img src="http://i301.photobucket.com/albums/nn69/noehawaii/createblog/simple/main.png">
</div>

<div id="link">
<a href="http://USERNAME.createblog.com/layouts/">view layouts</a> | <a href="http://USERNAME.createblog.com/graphics/">view graphics</a> | <a href="http://USERNAME.createblog.com/blogs/>bloggage</a> | <a href="http://USERNAME.createblog.com/photos/">photos</a> | <a href="http://USERNAME.createblog.com/friends/">friends</a> | <a href="http://USERNAME.createblog.com/winks.php?h...ache=1192662809">winks</a> | <a href="http://USERNAME.createblog.com/friends/add...ache=1192663004">+ me</a> | <a href="http://n-murray.createblog.com">N-Murray Creations</a> | <a href="http://edelihu.deviantart.com/">Brushes</a> | <a href="http://axeraider70.deviantart.com/">Brushes</a>
</div>

<div id="info">
blahblahblah<br>
blahblahblah<br>
blahblahblah<br>
blahblahblah<br>
blahblahblah<br>
</div>

<div id="commenteras">
<form action='comment.php' method='POST'>
<textarea id= 'comment' name='comment'>
blahblahblah </textarea>
<br>
<center>
<input type='submit' value='same old thing' class='button' /><br>


</form>

Here's my coding (Comments in scrollbox):

CODE

<style type="text/css">
#profile div#stats{display:none !important;}
#profile div#splash{display:none !important;}
#profile div#bestfriends {display:none!important;}
#profile div#aboutme {display:none !important;}
#profile div#contactme {display:none!important;}
#profile div#links{display:none!important;}
#profile div#recententries {display:none!important;}
#profile div#favorites {display:none !important;}
#profile div#submissions {display:none !important;}
#profile div#skills {display:none !important;}
#profile div#recentphotos{display:none !important;}
#profile div#comments{visibilty: visible;}

#comments{position: absolute; left: 100%; margin-left: 400px; top: 0%; margin-top: 50px; width: 400px; height: 75px;}

body { cursor:crosshair; }

a, a:link {
color:15b2e0;
text-decoration:none;
}

a:hover {
color: #ffce81;
text-decoration:overline;
cursor:all-scroll;
}

#info {
font-family: Gill Sans MT; font-size: 16px; color:#c1c1c1;
background-color:transparent; border:0px solid;
border-color:none; width:450px; height:75px;
position:absolute; overflow:auto; top:116px;
left:50%; margin-left:-478px;
}

#link {

font-family: small fonts; text-transform:uppercase; font-size: 8px; color:#c1c1c1;
background-color:transparent; border:0px solid;
border-color:none; width:958px; height:20px;
position:absolute; overflow:auto; top:60px;
left:50%; margin-left:-220px;
}

#profile div#footer{display:none !important;}
#profile div#comments{visibilty: visible;}
#headhoncho{position: absolute; left: 50%; margin-left: -30px; top: 0%; margin-top: 10px; width: 300px; height: 500px;}
#profile div#comments{position: absolute; left: 50%; margin-left: 150px; top: 0%; margin-top; 0px; width: 400px; height: 600px;}

</style>
<div style="top:115px; left:50%; margin-left:-480px; position:absolute;">
<img src="http://i301.photobucket.com/albums/nn69/noehawaii/createblog/simple/main.png">
</div>

<div id="link">
<a href="http://USERNAME.createblog.com/layouts/">view layouts</a> | <a href="http://USERNAME.createblog.com/graphics/">view graphics</a> | <a href="http://USERNAME.createblog.com/blogs/>bloggage</a> | <a href="http://USERNAME.createblog.com/photos/">photos</a> | <a href="http://USERNAME.createblog.com/friends/">friends</a> | <a href="http://USERNAME.createblog.com/winks.php?h...ache=1192662809">winks</a> | <a href="http://USERNAME.createblog.com/friends/add...ache=1192663004">+ me</a> | <a href="http://n-murray.createblog.com">N-Murray Creations</a> | <a href="http://edelihu.deviantart.com/">Brushes</a> | <a href="http://axeraider70.deviantart.com/">Brushes</a>
</div>

<div id="info">
blahblahblah<br>
blahblahblah<br>
blahblahblah<br>
blahblahblah<br>
blahblahblah<br>
</div>

[*Janette*]

Does anything happen with the scrollbars in the comment box if you attach a

CODE

</div>

at the very end of the Comment box version?

[Mikeplyts]

Try adding width and height attributes to the #comments part.

CODE

width:###px; height:###px;

Then, add this at the end of #comments.

CODE

overflow: auto;

See if that works.

[n-murray]

I'm glad to say you can close this now

[manny-the-dino]

Topic Closed