div comments - alter width of comment text |
![]() ![]() |
div comments - alter width of comment text |
Apr 23 2006, 02:56 AM
Post
#1
|
|
![]() Senior Member ![]() ![]() ![]() ![]() ![]() Group: Official Designer Posts: 441 Joined: Dec 2005 Member No: 330,617 |
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. |
|
|
|
Apr 23 2006, 03:14 PM
Post
#2
|
|
|
rawr? ![]() ![]() ![]() ![]() ![]() ![]() Group: Official Member Posts: 2,705 Joined: Nov 2005 Member No: 285,858 |
maybe you should try removing the comment code, from your div lay. becuz there is already a link saying view my comments.
|
|
|
|
Apr 23 2006, 03:37 PM
Post
#3
|
|
![]() Senior Member ![]() ![]() ![]() ![]() ![]() Group: Official Designer Posts: 441 Joined: Dec 2005 Member No: 330,617 |
I know there's already a link. But I have a redesigned copy of my layout that's not yet online where I have a space for comments. So I want to have it visible on the page. It's just hovering up there right now because I haven't uploaded my new layout yet. But I'm having issues with formatting the comments.
|
|
|
|
Apr 23 2006, 05:47 PM
Post
#4
|
|
![]() Senior Member ![]() ![]() ![]() ![]() ![]() Group: Official Designer Posts: 441 Joined: Dec 2005 Member No: 330,617 |
I managed to figure out by myself how to adjust the width of the comment text, but there's still a huge gap above it. Any ideas?
|
|
|
|
Apr 23 2006, 06:13 PM
Post
#5
|
|
![]() There Are Strange Things Afoot At The Cirlce K ![]() ![]() ![]() ![]() ![]() ![]() Group: Member Posts: 1,130 Joined: Oct 2005 Member No: 253,395 |
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 |
|
|
|
Apr 23 2006, 07:04 PM
Post
#6
|
|
![]() Senior Member ![]() ![]() ![]() ![]() ![]() Group: Official Designer Posts: 441 Joined: Dec 2005 Member No: 330,617 |
Thanks for that! But is there a way I can remove the huge gap where my top 8 should have been? I tried this method but it didn't do anything.
I also tried inserting this: CODE <style type="text/css"> td.text td.text table table table, td.text td.text table br, .rid br, td.text td.text table .orangetext15, td.text td.text .redlink, td.text td.text span.btext {display:none;} td.text td.text table td, td.text td.text table {height:0;padding:0;border:0;} td.text td.text table {background-color:transparent!important} td.text td.text table td {font-size:0} td.text td.text {height:0}</style>
|
|
|
|
![]() ![]() |