Tables

[Cooper94]

<table width="100%" cellpadding="1" cellspacing="1">
<tr>

<td>Albany, NY (ALB)</td>
<td>Atlanta, GA (ATL)</td>
<td>Baltimore, MY (BWI)</td>
<td>Bangor, MA (BGR)</td>
<td>Boston, MA (BOS)</td>
<td>Buffalo, NY (BUF)</td>
<td>Burlington, VT (BTV)</td>
<td>Birmingham, NY (BGM)</td>
<td>Charleston, SC (CHS)</td>
<td>Charlotte, NC (CLT) HUB</td>
<td>Chicago, IL (ORD)</td>
<td>Cleveland, OH (CLE)	</td>
<td>Columbus, OH (CMH)</td>
<td>Dallas Fort Worth, TX (DFW)</td>
<td>Detroit, MI (DTW)</td>
<td>Greensboro, NC (GSO)</td>
<td>Houston, TX (HOU)</td>
<td>Huntsville, AL (HSV)</td>
<td>Indianapolis, IN (IND)</td>
<td>Jacksonville, FL (JAX)</td>
<td>Kansas City, MO (MCI)</td>
<td>Key West, FL (EYW)</td>
<td>Manchester, NH (MHT)</td>
<td>Milwaukee, WI (MKE)</td>
<td>Minneapolis, MN (MSP)</td>
<td>Montreal, QC, CA (YUL)</td>
<td>Myrtle Beach, (MYR)</td>
<td>Nashville, TN (BNA)</td>
<td>New Orleans, (MSY)</td>
<td>New York, NY (JFK)</td>
<td>New York, NY (LGA)</td>
<td>Newark, NJ (EWR)</td>
<td>Norfolk, VA (ORF)</td>
<td>Orlando, FL (MCO)</td>
<td>Ottawa, OT, CA (YOW)</td>
<td>Pensacola, FL (PNS)</td>
<td>Philadelphia, PA (PHL) HUB</td>
<td>Pittsburgh, PA (PIT)</td>
<td>Portland, OR (PDX)</td>
<td>Providence, RI (PVD)</td>
</tr>


<tr>
<td>Raleigh, NC (RDU)</td>
<td>Richmond, VA (RIC)</td>
<td>Rochester, NY (ROC)</td>
<td>San Antonio, TX (SAT)</td>
<td>Savannah, GA (SAV)</td>
<td>Springfield, MO (SGF)</td>
<td>St. Louis, MO (STL)</td>
<td>Syracuse, NY (SYR)</td>
<td>Toronto, OT, CA (YYZ)</td>
<td>Washington D.C., WA (DCA) HUB</td>
<td>West Palm Beach, FL (PBI)</td>
<td>Wilmington, NC (ILM)</td>
</tr>
</table>

 

It isnt showing up in two lines it goes out to the right, I am trying to make it go into two lines line one is the first <tr> and the second collum or line is the last <tr> Any help I would be very greatful! Thank You

[Viola]

Do you mean that you want it in 2 columns?  <tr> means "table row", so the way you've done it would display it in two rows (lots of columns).

 

If so, try

<table width="100%" cellpadding="1" cellspacing="1">
<tr>
<td>Albany, NY (ALB)</td>
<td>Raleigh, NC (RDU)</td>
</tr>
<tr>
<td>Atlanta, GA (ATL)</td>
<td>Richmond, VA (RIC)</td>
</tr>
etc...
</table>
</code]

If this isn't what you mean, please can you explain some more?

[Cooper94]

I would like it so that first amount of Airports is on the left and than the next set is on the right.

[dropfaith]

<table width="100%" cellpadding="1" cellspacing="1">
<tr>
        	<td>
		<table>
			<tr><td>Albany, NY (ALB)</td></tr>
			<tr><td>Atlanta, GA (ATL)</td></tr>
			<tr><td>Baltimore, MY (BWI)</td></tr>
			<tr><td>Bangor, MA (BGR)</td></tr>
			<tr><td>Boston, MA (BOS)</td></tr>
		</table>
	</td>
	<td>
		<table>
			<tr><td>Raleigh, NC (RDU)</td></tr>
			<tr><td>Richmond, VA (RIC)</td></tr>
			<tr><td>Rochester, NY (ROC)</td></tr>
			<tr><td>Wilmington, NC (ILM)</td></tr>
		</table>

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

 

something like that . i wrote it on a netbook with a 5 inch screen so pardon any errors but i think its what your looking for

[dropfaith]

hrmm i looked at his code above my post and that would work with less markup  by a little bit . you would need to reorginize  your lists tho

 

Ie his would display

 

first airport    / second

3rd                / 4th

 

and so on so if you want to keep the way you have them organized mine might be easier to edit to match

[haku]

Also, nested tables (a table inside a table) are hard for browsers to render, and take much much longer to render, so they should really be avoided at all costs.

[Viola]

If all you're wanting to do is show a single list, but are using tables to create a 2-column visual layout, I guess you could create a table with 1 row and 2 columns.  Then you wouldn't have to rearrange your lists.

 

<table width="100%" cellpadding="1" cellspacing="1" style="vertical-align: top;">
<tr>
<td>Albany, NY (ALB)<br/>
       Atlanta, GA (ATL)<br/>
       Baltimore, MY (BWI)<br/>
       Bangor, MA (BGR)<br/>
etc...
</td>

<td>Raleigh, NC (RDU)<br/>
       Richmond, VA (RIC)<br/>
       Rochester, NY (ROC)<br/>
       San Antonio, TX (SAT)<br/>
       etc...
</td>
</tr>
</table>

 

I'm not sure what the "good practice" gurus would have to say about this, though.

[haku]

Not much good! haha

Actually, it will render faster that way because there are less table rows, but tables are supposed to be for tabular data, which means giving each individual cross referenceable piece of data its own cell.

 

Although to be honest, this airport list isn't even tabular data, so it shouldn't be in a table at all...

[dropfaith]

the single table works i would use a ul  tho instead of brs for each line

 

more style options althought if were rewriting the entire thing id drop the table and just use 2 divs as well

 

 

[Viola]

I agree.  It doesn't seem right to use tables to display a list.

 

Cooper94 -- you could try something like this:

 

<div style="width:50%;"> <!-- Outer div -->

<div style="float:left;width:50%;"> <!-- left column -->
<ul style="list-style:none;padding:2px;margin:2px;"><!-- unordered list -->
<!-- list items -->
<li>Albany, NY (ALB)</li>
<li>Atlanta, GA (ATL)</li>
<li>Baltimore, MY (BWI)</li>
<li>etc...</li>
</ul>
</div>

<div> <!-- right column -->
<ul style="list-style:none;padding:2px;margin:2px;"><!-- unordered list -->
<!-- list items -->
<li>Raleigh, NC (RDU)</li>
<li>Richmond, VA (RIC)</li>
<li>Rochester, NY (ROC)</li>
<li>etc...</li>
</ul>
</div>

</div>

 

If you're not familiar with styles, take a look at this website:

http://w3schools.com/css/