View Full Version : Aligning these tables, and moving the text..


chrishawthorne
03-22-2004, 11:44 PM
Im new to tables, I was hoping someone could help me figure out how to align these tables together, so that the band homepage column is in the middle, and the picture's of the houses go right under band home page

http://www.unsigned-online.com/samHTMweb/playing.html

chrishawthorne
03-23-2004, 01:12 PM
I found some errors in my code, like some double tags, and fixed them, but that didn't seem to solve the problem. And I also updated the pages, because it was dis-playing an old one.

Rosey
03-23-2004, 01:18 PM
On my screen, the images are under the "Band Homepage". I looked on IE and Netscape and it looks like that on both.

The only thing that I see is that bright red color on IE, hurts the eyes. And then you have that white space on the first row below "band homepage"

chrishawthorne
03-23-2004, 01:24 PM
Well, thats what i cant figure out how to fix, that white space

As for the colors, i am gonna change them right after i gedt this fixed. Well, im on 1024x728 and the images appear to the left of band homepage

Rosey
03-23-2004, 01:46 PM
To fix that space, you need to add another td tag. You only have 2 on the second row but you have 3 on the top (where you have currently playing, band homepage, time)

so add another <td> tag there.

For the 3 row, i would also only have 3 td tags.

One for the Recently Played Song, one for the house image AND the website and one for the time.

When you make a table, you have to keep the same number of td tags or it will screw up things.

chrishawthorne
03-23-2004, 03:04 PM
well, im completely new to tables, what do I need to put in the <td> tag?

Rosey
03-23-2004, 03:33 PM
Ok, I kinda played around with your code. Sometimes it's hard for me to see so I have to build from scratch.

First of all, you need to start using css, if you are new to html and making webpage, just learn css, it's a lot easier to change a color if you don't like it than going around to all the font tags to change it.

This is what I did for the table that contains the songs and stuff:


<table border="0" width="80%" cellspacing="0" cellpadding="4">

<tr bgcolor="#002E5B" class="header">

<td nowrap align="left"><b>Currently Playing
</td>

<td nowrap align="left">Band Homepage
</td>

<td nowrap align="left">Time

</td>
</tr>


<tr bgcolor="$darkrow$" class="tablecontent">

<td width="33%"></td>

<td nowrap width="33%" style="text-align:left;"><a href="" target="_blank"><img
src="images/home.gif" alt="Band Homepage" border="0"></a>
</td>


<td width="33%">test </td>
</tr>


<tr bgcolor="#002E5B" class="header">
<td colspan="3" nowrap>
Recently Played Songs
</td>

</tr>

<tr bgcolor="$darkrow$" class="tablecontent">
<td>The Guest - House Burning Down</td>

<td nowrap>
<a href="http://www.theguestband.com" target="_blank"><img
src="images/home.gif" alt="Artist Homepage" border="0"></a> theguestband.com</td>

<td nowrap>3:35</td>
</tr>



</table>


I just put one line there, you'd have to add the others.

I made some css that you can add to your style sheet:


.header {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color:#FFFFFF;
font-weight:bold;
}

.tablecontent {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color: #003366;
font-weight:bold;
}


I hope that helps.

chrishawthorne
03-23-2004, 03:45 PM
see, i would prefer to use CSS with it, but these are pages that are generated by a program i bought, and this particular page is referenced in 26 different pages, and i would have to change colors on all 26 of them if i wanted to change it, so I will try to fix the code using what you put. thanks!

Rosey
03-23-2004, 03:50 PM
ok. just keep in mind that i didn't look at the rest of the table.

chrishawthorne
03-24-2004, 01:03 AM
i added it, but it completely throws off the alignment of the page.

Keep in mind, i only want to extend the red to the right side of the page.

here is the code i have to work with..

<html>

<head>
<title>Unsigned Online</title>
<LINK REL=STYLESHEET HREF="style.css" TYPE="text/css">
<script language='JavaScript1.2'

src='http://www.audiorealm.com/player/player.js.html?srefID=0&subscription=no'></script>
<script language='JavaScript1.2' src='java/request.js'></script>
<script language='JavaScript1.2' src='java/songinfo.js'></script>
</head>

<body>

<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="1%" align="center"><a href="playing.php"><img border="0"

src="images/logo.gif"></a><br>
<img border="0" src="images/spacer.gif" width="15" height="13"></td>
<td width="99%" valign="middle" align="left"><b></b></td>
</tr>
<tr>
<td width="100%" colspan="2" bgcolor="#000080"><img border="0" src="images/spacer.gif"

width="1" height="1"></td>
</tr>
</table>

<br>

<table border=0 cellspacing=5 cellpadding=5>
<tr>

<td align="left" valign="top" width="99%">

<SCRIPT LANGUAGE="JavaScript">
<!---
var refreshID = "";
refreshID = setTimeout("DoRefresh()", $timeout$);

function DoRefresh()
{
var buster = Math.random();
document.location.href = 'playing.html?buster='+buster;
}
//--->
</SCRIPT>

There are currently 0 listeners tuned into Unsigned Online!<br><br>

<table border="0" width="80%" cellspacing="0" cellpadding="4">
<tr bgcolor="#002E5B">
<td colspan="2" nowrap align="left">
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"

color="#FFFFFF"><b>Currently Playing</b></font>
</td>
<td colspan="2" nowrap align="left">
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"><b>Band

Homepage</b></font>
</td>
<td nowrap align="left">


<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"

color="#FFFFFF"><b>Time</b></font>
</td>
</tr>

<tr bgcolor="$darkrow$">


<td><font size="2" color="#003366"><small></small></font></td>

<td nowrap width="1%">
<p align="center"><font size="2" color="#003366"><a href="" target="_blank"><img
src="images/home.gif" alt="Band Homepage" border="0"></a></font>
</td>



<tr bgcolor="#002E5B">
<td colspan="6" nowrap>
<p align="left"><b><font size="1" face="Verdana, Arial, Helvetica, sans-serif"

color="#FFFFFF">Recently
Played Songs</font></b>
</td>
</tr>



<tr bgcolor="$darkrow$">
<td><font size="2" color="#003366"><small>The Guest - House Burning

Down</small></font></td>

<td nowrap width="1%">
<p align="center"><font size="2" color="#003366"><a href="http://www.theguestband.com"

target="_blank"><img
src="images/home.gif" alt="Artist Homepage" border="0"></a></font>
</td>

<td nowrap align="center" nowrap width="1%"></td>

<td nowrap><font color="#003366" size="2"><small>theguestband.com</small></font></td>
<td nowrap>
<p align="right"><font color="#003366"

size="2"><small><strong>3:35</strong></small></font>
</td>
</tr>


<tr bgcolor="$darkrow$">
<td><font size="2" color="#003366"><small>The Guest - Leaving It All

Behind</small></font></td>

<td nowrap width="1%">
<p align="center"><font size="2" color="#003366"><a href="http://www.theguestband.com"

target="_blank"><img
src="images/home.gif" alt="Artist Homepage" border="0"></a></font>
</td>

<td nowrap align="center" nowrap width="1%"></td>

<td nowrap><font color="#003366" size="2"><small>theguestband.com</small></font></td>
<td nowrap>
<p align="right"><font color="#003366"

size="2"><small><strong>2:26</strong></small></font>
</td>
</tr>


<tr bgcolor="$darkrow$">
<td><font size="2" color="#003366"><small>The Guest - Themes Of

Crush</small></font></td>

<td nowrap width="1%">
<p align="center"><font size="2" color="#003366"><a href="http://www.theguestband.com"

target="_blank"><img
src="images/home.gif" alt="Artist Homepage" border="0"></a></font>
</td>

<td nowrap align="center" nowrap width="1%"></td>

<td nowrap><font color="#003366" size="2"><small>theguestband.com</small></font></td>
<td nowrap>
<p align="right"><font color="#003366"

size="2"><small><strong>5:22</strong></small></font>
</td>
</tr>


<tr bgcolor="$darkrow$">
<td><font size="2" color="#003366"><small>The US Thrash Co. - Sub Deral

Hematoma</small></font></td>

<td nowrap width="1%">
<p align="center"><font size="2" color="#003366"><a href="http://www.usthrash.com"

target="_blank"><img
src="images/home.gif" alt="Artist Homepage" border="0"></a></font>
</td>

<td nowrap align="center" nowrap width="1%"></td>

<td nowrap><font color="#003366" size="2"><small>usthrash.com</small></font></td>
<td nowrap>
<p align="right"><font color="#003366"

size="2"><small><strong>4:22</strong></small></font>
</td>
</tr>


<tr bgcolor="$darkrow$">
<td><font size="2" color="#003366"><small>None The Less - Me x3</small></font></td>

<td nowrap width="1%">
<p align="center"><font size="2" color="#003366"><a

href="http://www.nonethelessrocks.com" target="_blank"><img
src="images/home.gif"></font>
</td>




<td nowrap align="center" nowrap width="1%"></td>

<td nowrap><font color="#003366"

size="2"><small>nonethelessrocks.com</small></font></td>
<td nowrap>
<p align="right"><font color="#003366"

size="2"><small><strong>3:48</strong></small></font>
</td>
</tr>


</table>

</td><td valign='top' align='center'>

<table width="100%" bgcolor="$lightrow$" border="0" cellspacing="0" cellpadding="5">
<tr bgcolor="$darkrow$"><td nowrap><b><font size="1" face="Verdana, Arial, Helvetica,

sans-serif" color="#555555">Top10 Requests</font></b></td></tr>
<tr><td nowrap>

<font size="2" color="#003366"><small>1.
<a href="" target="_blank">75 Sense</a></small></font> <font size="2"

color="#9F9F9F"><small>(3)</small></font><br>
<font size="2" color="#003366"><small>&nbsp;&nbsp;&nbsp;&nbsp;Wyatt

Trash</small></font><br>

<font size="2" color="#003366"><small>2.
<a href="" target="_blank">The Guest</a></small></font> <font size="2"

color="#9F9F9F"><small>(1)</small></font><br>
<font size="2" color="#003366"><small>&nbsp;&nbsp;&nbsp;&nbsp;Leaving It All

Behind</small></font><br>

</td></tr>
</table>








</td>

</td>
</tr>
</table>

<br>
<table cellpadding=2 cellspacing=2 border=0 width="100%">
<tr><td align="center"><hr width="80%" size="1" color="#00005E"></td></tr>
<tr><td align="center">

<p><font size="1">This station is part of the <a

href="http://www.audiorealm.com">AudioRealm</a>
network.<br>
This page was produced using <a target="_blank"

href="http://www.spacialaudio.com">SAM<sup>2</sup>
(Streaming Audio Manager)</a>. © Copyright <a target="_blank"

href="http://www.spacialaudio.com">Spacial Audio
Solutions, LLC</a> 1999 - 2003.</font></p>

</td></tr>
</table>

</body>
</html>

Rosey
03-24-2004, 02:10 PM
Try this then:

Add this:

<td colspan="3"><font size="2" color="#003366"><small></small></font></td>
</tr>

after this:


<td nowrap align="left">


<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"

color="#FFFFFF"><b>Time</b></font>
</td>
</tr>

<tr bgcolor="$darkrow$">


<td><font size="2" color="#003366"><small></small></font></td>

<td nowrap width="1%">
<p align="center"><font size="2" color="#003366"><a href="" target="_blank"><img
src="images/home.gif" alt="Band Homepage" border="0"></a></font>
</td>

chrishawthorne
03-24-2004, 04:59 PM
yay ! it fixed the length issue, now how do I put "band homepage" directly over the House pictures?

chrishawthorne
03-24-2004, 06:22 PM
yay ! it fixed the length issue, now how do I put "band homepage" directly over the House pictures?

nvm I figured it out! Thanks so much!