Hi Adam,
Because of so many problems with tables, we decided that we will default a table with certain settings for the <TABLE> and <TD> tags by using a style sheet and default settings for <TABLE> in constant.js.
So, we have set constant.js so that tables default with this: <TABLE class=sample style="FONT-SIZE: 12px; FONT-FAMILY: Verdana" cellSpacing=0 cellPadding=0 width=500 border=0>
The tag references class=sample, and that's contained in the <HEAD tag: <LINK href="class/qtable.css" type=text/css rel=stylesheet>
qtable.css contains:
table.sample td {
padding-bottom: 0px;
width: 150px;
padding-top: 0px;
text-align: left;
vertical-align: top;
align: left;
}
OK, so the theory is that the table will start with the defined structure and each <TD will take the default characteristics in the style sheet.
That works well for us and overcomes a lot of the problems with CE tables.
However, when the user tries to format an element within the table (like a specific cell), the overrides are ignored by CE.
We have the below HTML code. Note the link to qtable.css and the <TD align=right>4</TD> in the content area. The align=right is being ignored by CE because there is a td style setting in qtable.css.
<HTML>
<HEAD>
<LINK href="class/qtable.css" type=text/css rel=stylesheet>
</HEAD>
<BODY style="FONT-SIZE: 12px; FONT-FAMILY: Verdana" bottomMargin=50 leftMargin=75 topMargin=50 rightMargin=50>
<DIV> </DIV>
<DIV> </DIV>
<DIV>
<TABLE class=sample style="FONT-SIZE: 12px; FONT-FAMILY: Verdana" cellSpacing=0 cellPadding=0 width=500 border=0>
<TBODY>
<TR>
<TD>1</TD>
<TD>2</TD>
<TD>3</TD>
<TD align=right>4</TD> <<This is being ignored by CE
</TR>
<TR>
<TD>5</TD>
<TD>6</TD>
<TD>7</TD>
<TD>8</TD>
</TR>
</TBODY>
</TABLE>
</DIV>
<DIV> </DIV>
<DIV> </DIV>
</BODY>
</HTML>
The problem is that <TD align=right>4</TD> is supposed to display right-aligned, but is being overridden by the class's td settings which aligns it left.
What we need is the other way around. Is that possible? Could CE first apply the settings of the style sheet, then override any of those settings where the user has used the Table Wizard to change?
If I remove the class=sample in the <TABLE tag, the cell correctly aligns right...
That's not all. The class file sets the width at 150px for td, but when I select Table Properties and then try to set the cell's properties to another width - for example, 200, CE shows the width as 200, but ignores the setting when I return to the content. Again, CE is allowing the style to override the individual settings, instead of the other way around..
How to fix these problems?
FredD