August 30, 2008 04:30am pdt

Member Login

Hall of Fame

Yearly

1Kravimir 501,837
2hielo 490,925
3Steggs 274,930
4scrathcyboy 143,544
5VirusMinus 111,372
6TName 94,585
7GreenGho... 94,541
8mreuring 79,805
9zemond 77,885
10bluefezteam 75,832
11glumlun 73,615
12mplungjan 69,992
13jason1178 66,415
14Rouchie 57,060
15Lolly-Ink 52,832
16b0lsc0tt 48,174
17Eternal_S... 47,243
18nexusnation 46,650
19strobbe 40,200
20zkeown 39,775
21xberry 39,375
22ali_kayahan 37,930
23logicalins... 37,925
24wilq32 36,560
25Ray_Pas... 36,175

	[x] Attachment Details

Trying to trick table layout- need creative help

Zones: JavaScript, Cascading Style Sheets (CSS), Hypertext Markup Language (HTML)

I have a real constraint on the content of a web page. It's a page that is templated with a table, and the only control I have is over the content within the <td> cells. What I'm trying to do is achieve a 3 by 3 layout. The problem is that the web page is templated with 1 cell per row. Here's my example:

<html>
<body>

<table>
<tr id="row_1">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_2">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_3">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_4">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_5">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_6">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_7">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_8">
<td>
Your content goes here...
</td>
</tr>
<tr id="row_9">
<td>
Your content goes here...
</td>
</tr>
</table>

</body>
</html>

This will only give one cell per row, but I'm trying to do 3 cells per row. Can anyone think of a way of making this a 3 by 3 row by ONLY modifying the "Your content goes here..." areas, Javascript and CSS (fortunately I can always rely on the table row id's)? I tried floating the table rows like tr { float: left; }, but it doesn't work for IE, so I was hoping for something more reliable.

Start your free trial to view this solution

[x]

The Solution Rating System

With so many solutions, how can you tell which solutions are most likely to help you and which ones are not? To provide you with a tool to use, we rate our solutions based on various elements that most accurately determine if a solution is a quality solution. To explain what factors affect the solution rating, here are the elements we take into consideration when formulating our solution rating.

The Grade of the Solution
The Zone Rank of the Expert Providing the Solution
The Number of Author and Expert Comments
The Number of Experts Contributing
The Feedback of the Community

Your Input Matters
Because of the way the system is set up, the most important variable in this equation is you. As a member of Experts Exchange, you are able to cast your vote on the quality of the solutions in regard to how complete, accurate, helpful and easy to understand each solution is. When you provide your feedback, each rating is adjusted accordingly. So, if you see a solution that has a poor rating that you think is a good solution, let us know by rating it. As you do, the rating will be adjusted and will become more accurate for other members of our site.

If you have any suggestions that you would like to make for our rating system, please ask a question in the Suggestions Zone of Community Support.

Thank you!

8.8

Question Stats

Zone: Web Development

Question Asked By: bemara57

Solution Provided By: Badotz

Participating Experts: 3

Solution Grade: A

Translate:

Loading Advertisement...

20080723-EE-VQP-34 / EE_QW_2_20070628