Table Not Displaying Properly in Diff Browsers

Nightmare Tables...

Hi there,

I actually have a few questions about tables.

1.) I created a table with Wiki Syntax, edited it with the Wysiwyg which turned the whole thing to a nightmare of HTML <tr><td>... Is there a way around the Wysiwyg transforming the Wiki Syntax into HTML? I've looked at the TablePlugin but haven't been able to find a way to edit the color of only a handful of cells (vs. an entire row). The main problem is that non-technical staff will be updating this table with info and they've already once deleted the whole thing and had the table looking like the tower of Pisa...

The WYSIWYG plugin tries to preserve the TML markup after save, but if the TinyMCE editor outputs attributes that are not compatible with TML, the WYSIWYG plugin has to preserve the html. Some of the things that force HTML to be generated include:

Drag the table column or row sizes. Explicitly set size cannot be represented in TML.

Table and Cell background colors
Check out the VarTABLE macro and use it to override
To set text background colors, you could define a Foswiki custom macro.
   * Set ALERT = <FONT style="BACKGROUND-COLOR: yellow">
   * Set CRITICAL = <FONT style="BACKGROUND-COLOR: red">
   * Set EA = </FONT>
Then you can reference it in a table cell or any other text This text has yellow background and This is red.

Table with Color backgrounds

yellow red

Table with	Color backgrounds
yellow	red

2.) The other issue is that the table doesn't display properly in IE. I don't know if the issue has to do with me having set the border color to #abada3 (a grey color) or has to do with the Wysiwyg and the single cells that I colored yellow. At any rate the combination of the two is leading the colored cells to be the ones with the border and the others, where there is no content, are just a white mass in the table. In Firefox, the border is displayed - but in black instead of grey and in Chrome, which I use, it looks absolutely perfect. I don't know what is causing the strangeness in the other browsers. Is there a Plugin I can use for this table? Essentially, the table is performing an imagemap function. It is a table which shows a list of employees at the top and then a list of functions on the left and the colored boxes indicate who is responsible for which task. The only links in the table are on the left, which connect to the individual tasks or services offered and the top (where I've used the ImagePlugin) to link in the employee images that redirect to their profile pages. Is there a Plugin for making an imagemap?

I don't really know about rendering issues with IE, though it is notorious for rendering issues, especially IE6. The DirectedGraphPlugin can generate hierarchy charts including clickable areas using client side image maps, or SVG type diagrams.

For the table coloring, I've never tried it but you might look at adding a JQuery plugin to do table styling. For example: http://www.jnathanson.com/blog/client/jquery/heatcolor/index.cfm - See UsingJQueryWithFoswiki for information on extending the default JQuery plugins shipped with Foswiki.