HTML Help

jessespeelman · Joined: 20 Mar 2009 Posts: 4

I made a band layout and can't figure out how to take out the extra space at the end of the page.

Here is the site:
www.myspace.com/jspeeltest

Here is the code:
Code:
Kodiak Era is a fresh face making music in the Metro-Detroit area. With influences from every possible genre, the five piece band does their best to write art that encompasses many different sounds. Selecting from metal, classic rock, folk, techno, worship music, and the list goes on.<p>

KE is a bunch of good friends that have a passion for writing music that doesn't fit the mold, but if someone were to say it did fit a mold, well...they are alright with that to. <p>

</td>
</tr>
<td valign="top" align="left" width="435" bgcolor="ffffff" style="word-wrap:break-word"><span class="orangetext15">Promote</span><center>

Add a banner to your page!<p>

<img src="http://i41.tinypic.com/rciijs.gif" width="380"><br><textarea><a href="http://www.myspace.com/kodiakera" target="_blank"><img src="http://i41.tinypic.com/rciijs.gif" border="0"></a></textarea>

<style>div.profileWidth {width:800px;}
body table {margin-top:633px;}
body td table, body div table {margin-top: 0;}
.navbar {visibility:visible;}
</style>

<div class="header" style="width: 800px; position: absolute; margin-left: -400px; left: 50%; top: 174px; z-index:4; overflow: hidden;">

<table id="Table_01" width="800" border="0" cellpadding="0" cellspacing="0">
<tr>

<td colspan="7">
<img src="http://i43.tinypic.com/2urp4id.png" width="800" height="624" alt="" /></td><tr>

<td rowspan="3">
<A href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJRD0zODc5NjUzMzc="> <img src="http://i40.tinypic.com/vpw7c0.png" width="120" height="61" border="0" alt="" /></a></td>

<td>
<a href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTM4Nzk2NTMzNyZNeVRva2VuPWY2M2MwODgyLWZkMDQtNDRhZi04NDBiLTdlYTZjZmQ5ODI1MQ=="> <img src="http://i40.tinypic.com/2cpxr7r.png" width="247" height="61" border="0" alt="" /></a></td>

<td rowspan="2">
<a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=387965337"><img src="http://i44.tinypic.com/esqf4n.png" width="201" height="61" border="0" alt="" /></a></td>

<td rowspan="2">
<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD0zODc5NjUzMzcmTXlUb2tlbj01YTkxZWI2Zi03NjRhLTQyMTMtODczYS0xOWZmODkwNmY3NmU="><img src="http://i39.tinypic.com/25k5vly.png" width="232" height="61" border="0" alt="" /></a></td>

</table>

<style>
div.profileWidth table td {background-color:3CB371!important;}
</style>

<style>
.contactTable {display: none;}
</style>

<style>
.katamari Section Manager
{ http://abrax.us/SectionManager }
table.friendSpace td {padding:0px;}
table.friendSpace td.text td br {line-height:0px;}
table.friendSpace span.btext {display:none;}
</style>

<style>
.nametext, td.text font strong
{font-family:arial;
color:FFFFFF;
font-size:0px;}

.redlink {display:none;}

.whitetext12 {color:FFFFFF; font-size: 10px; margin: 0px 0px 4px 0px; padding: 0px 0px 0px 10px; text-align: left; display: block; font-family:Verdana; font-weight: bold; width: 270px; text-transform: uppercase;background-image: url(http://img15.imageshack.us/img15/6838/headerknw.jpg); background-position: bottom right; background-repeat: no-repeat;height: 24px;line-height:24px;overflow:hidden;}

.btext {color:FFFFFF; font-size: 10px; margin: 14px 0px 4px 0px; padding: 0px 0px 0px 10px; text-align: left; display: block; font-family: Verdana; font-weight: bold;width: 372px; text-transform: uppercase;background-image: url(http://img15.imageshack.us/img15/6838/headerknw.jpg); background-position: bottom right; background-repeat: no-repeat;height: 24px;line-height:24px;overflow:hidden;}

.orangetext15 {color:FFFFFF; font-size: 10px; margin: 14px 0px 4px 0px; padding: 0px 0px 0px 10px; text-align: left; display: block; font-family: Verdana; font-weight: bold;width: 372px; text-transform: uppercase;background-image: url(http://img15.imageshack.us/img15/6838/headerknw.jpg); background-position: bottom right; background-repeat: no-repeat;height: 24px;line-height:24px;overflow:hidden;}
</style>

<style type="text/css">
.mygen { Background Properties }
table, tr, td { background-color:transparent; border:none; border-width:0;}
body {
background-color:FFFFFF;
background-image:url(http://img23.imageshack.us/img23/4378/bckg2.jpg);
background-attachment: fixed;
background-position:center center;
background-repeat:repeat;}

.mygen { Table Properties }
table table { border: 0px }
table table table table{border:0px}
table table table {background-color:FFFFFF;}

.mygen { Text Properties }
table, tr, td, li, p, div { font-family:verdana; color:000001; font-size:10px; }
.btext { font-family:verdana; color:ffffff; font-size:10px; font-weight:bold; }
.blacktext10 { font-family:verdana; color:000001; font-size:9px; }
.lightbluetext8 { font-family:verdana; color:000001; font-size:10px; font-weight:bold; }
.orangetext15 { font-family:verdana; color:ffffff; font-size:10px; font-weight:bold; }
.redtext { font-family:verdana; color:000001; font-size:10px; }
.redbtext { font-family:verdana; color:000001; font-size:10px; font-weight:bold; }
.text { font-family:verdana; color:000001; font-size:9px; }
.whitetext12 { font-family:verdana; color:ffffff; font-size:10px; font-weight:bold; }
a:active, a:visited, a:link { font-family:verdana; color:980007; font-size:10px; }
a:hover { font-family:verdana; color:ed1f29; font-size:10px; text-decoration: none}
</style>

<style type="text/css">
.blacktext10
{
border-top-width: 1px;
border-bottom-width: 0px;
border-left-width: 0px;
border-right-width: 0px;
border-style: solid;
border-color: FF0000;
display: block;
width: 100%;
}
</style>

I know that it has something to do with how I moved the page down. I took out the following code and the space at the bottom was fixed, but the page wasn't pushed down. Is there anyway to control the two separately?

[code]
body table {margin-top:633px;}
[code][/code]

PayneLess Designs · Joined: 28 Feb 2007 Posts: 3593 Location: Biloxi, MS

Didn't find it, but a quick look and edit of HTML shows it has something to do with the styling of the last table containing the links at the bottom. Code: <table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr bgcolor="#e5e5e5" valign="top"><td id="footerWarpper"><div align="center"><div align="center"><br>
<a class="text" href="http://www.myspace.com/index.cfm?fuseaction=misc.aboutus" target="_blank" onclick="MySpace.CMS.track('1c29e472-9822-4527-a233-695d8271253a')">About</a> |
<a class="text" href="http://faq.myspace.com/" target="_blank" onclick="MySpace.CMS.track('1c29e472-9822-4527-a233-695d8271253a')">FAQ</a> |
<a class="text" href="http://www.myspace.com/index.cfm?fuseaction=misc.terms" target="_blank" onclick="MySpace.CMS.track('1c29e472-9822-4527-a233-695d8271253a')">Terms</a> |
<a class="text" href="http://www.myspace.com/index.cfm?fuseaction=misc.privacy" target="_blank" onclick="MySpace.CMS.track('1c29e472-9822-4527-a233-695d8271253a')">Privacy Policy</a> |
<a class="text" href="http://www.myspace.com/index.cfm?fuseaction=cms.viewpage&placement=safety_pagehome" target="_blank" onclick="MySpace.CMS.track('1c29e472-9822-4527-a233-695d8271253a')">Safety Tips</a> |
<a class="text" href="http://www.myspace.com/index.cfm?fuseaction=misc.contact" target="_blank" onclick="MySpace.CMS.track('1c29e472-9822-4527-a233-695d8271253a')">Contact MySpace</a> |

OK. Going through and editing CSS, this DOES correct the problem with removing it: "body table {margin-top:638px;}". I didn't see where the page changed anywhere else except having the large space at bottom removed.

jessespeelman · Joined: 20 Mar 2009 Posts: 4

Thanks for your help.

That code actually moved the comments to the right, and added in the myspace link table again higher up in the page. I got rid of a little bit of the code, and it worked now by just using:

Code:
<table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody>

jessespeelman · Joined: 20 Mar 2009 Posts: 4

You know what, looking at it again, if there is a comment longer than the comment box, it gets super stretched out. Any way to fix it?

PayneLess Designs · Joined: 28 Feb 2007 Posts: 3593 Location: Biloxi, MS

jessespeelman wrote: Thanks for your help.

That code actually moved the comments to the right, and added in the myspace link table again higher up in the page. I got rid of a little bit of the code, and it worked now by just using:

Code:
<table border="0" cellpadding="0" cellspacing="0" width="100%"><tbody>
Doesn't do that for me in Firefox. I edited your page in real time to see the effects with my installed web tools. All it seemed to do is get rid of the space as you wanted. Cellspacing as you put it, is the same as you were doing by CSS...setting the margin to zero!

PayneLess Designs · Joined: 28 Feb 2007 Posts: 3593 Location: Biloxi, MS

jessespeelman wrote: You know what, looking at it again, if there is a comment longer than the comment box, it gets super stretched out. Any way to fix it? Might try adding the following to the scrollbox styling:

Code: overflow: scroll;

jessespeelman · Joined: 20 Mar 2009 Posts: 4

Where exactly would I put that?

PayneLess Designs · Joined: 28 Feb 2007 Posts: 3593 Location: Biloxi, MS

I don't quite keep up with MySpace's styling, but whichever styling is used for the comment box is where it would go. MySpace has its own idea what HTML code is and it has its quirks which, at times, are hard to overcome. Will try to track it down, but don't get your hopes up.