Forum Moderators: not2easy
I'm trying to convert a table with 6 columns that looks like this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<title>test</title>
</head>
<body>
<table class="myTable" width="640px">
<tr>
<td><a href="#">
<img src="img/announce.gif" align="middle" border="0"></a>
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Announcements
</span></a><br />
Happy Ad; Seminars: Obituaries; Special Announcements
</td>
<td><a href="#">
<img src="img/new_icons/auction.jpg" align="middle" border="0"></a>
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Auction/Flea Market/Yard Sale
</span></a><br />
Auctions; Flea Market; Garage Sales
</td>
<td><a href="#">
<img src="img/new_icons/Antiques.jpg" align="middle" border="0"></a>
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Antiques/Collectibles
</span></a>
<br />Antiques; Collectibles</td>
</tr>
<tr>
<td><a href="#">
<img src="img/new_icons/appliances.gif" align="middle" border="0"></a>
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Appliances
</span></a>
<br />Appliances
</td>
<td>
<a href="#">
<img src="img/transportation.gif" align="middle" border="0">
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Automotive/Transportation
</span></a><br />
New; Used; Rental; Motorcycles; Recreational; Repair; Parts
</td>
<td><a href="#">
<img src="img/finance.gif" align="middle" border="0"></a>
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Banking
</span></a>
<br />Banks; Credit Unions; Mortgages
</td>
</tr>
<tr>
<td><a href="#">
<img src="img/new_icons/boating.jpg" align="middle" border="0"></a>
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Boating
</span></a>
<br />New; Used; Service; Marinas
</td>
<td>
<a href="#">
<img src="img/new_icons/Bridal.jpg" align="middle" border="0">
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Bridal
</span></a><br />
Wedding Services
</td>
<td><a href="#">
<img src="img/new_icons/childcare.gif" align="middle" border="0"></a>
</td>
<td><a href="#">
<span style="FONT-WEIGHT: bold; FONT-SIZE: 12px">
Childcare
</span></a>
<br />Preschool; Day Care
</td>
</tr>
</table>
</body>
</html>
...to a CSS layout. The only catch is I need to keep it within 640px
(630px ideally). The styling associated with "myTable" is mainly font
properties and does not need to be preserved. If anyone has a
suggestion on how to pull this off I would greatly appreciate it.
I only see 3 columns, and then 3 row, making 9 cells.
What are the dimensions for the images?
Also don't forget to include alt text for images.
This should be quite easy to convert from tables, just one question:
does it matter if the image is centred with the text like that, or can it just be at the start of where each cell begins?
it is possible to set up, but it would be a tiny bit messy.
I don't think it would look too bad if it wasn't centred vertically.
[edited by: Xapti at 7:44 am (utc) on June 18, 2007]
