I've got a strange problem with 'align="center"' attributes of <td> tags
being ignored in certain cases.

Can someone have a look at these two examples and see if they can see what
I'm doing wrong.

The problem seems to be that if I define the width of the cell and include
an 'align=' in the same <td>, the alignment is ignored, whereas if I define
just the widths (with empty cells) on one row and then define just the
alignment (no widths) on the next row with the data, the alignment works.

http://www.martinunderwood.f9.co.uk/...list-works.htm
http://www.martinunderwood.f9.co.uk/...list-fails.htm

These both use a stylesheet

http://www.martinunderwood.f9.co.uk/census/table.css


which defines <td> and <td class="head">, though in neither case do I define
horizontal-align, so it's not a case of the definition in the CSS taking
precedence over the align attribute in the <td> tag.


The crucial differences are:

Works
-----

<table border=2 width="100%" style='border-collapse:
collapse;table-layout:fixed;' bordercolorlight="#000000"
bordercolordark="#000000">
<tr>
<td class=head width=30></td>
<td class=head width=105></td>
<td class=head width=105></td>
<td class=head width=30></td>
<td class=head width=30></td>
</tr>
<tr>
<td class=head align="center">Year</td>
<td class=head>Surname</td>
<td class=head>Forenames</td>
<td class=head align="center">Age</td>
<td class=head align="center">Sched</td>
</tr>


Fails
-----

<table border=2 width="100%" style='border-collapse:
collapse;table-layout:fixed;' bordercolorlight="#000000"
bordercolordark="#000000">
<tr>
<td class=head width=30 align="center">Year</td>
<td class=head width=105>Surname</td>
<td class=head width=105>Forenames</td>
<td class=head width=30 align="center">Age</td>
<td class=head width=30 align="center">Sched</td>
</tr>

Martin Underwood wrote in message
43f6274c$0$82673$ed2619ec@ptn-nntp-reader03.plus.net:

I've simplified things by taking out all reference to the CSS in case that
was confusing things:

http://www.martinunderwood.f9.co.uk/...simplified.htm

But the problem still exists.

Checking on Opera and Firefox, the problem does not exist: it's confined to
IE - what a surprise!

Can anyone think of a workaround for IE - short of defining a zero-height
invisible row above the heading row.

"Martin Underwood" <a@b> wrote in message
news:43f6274c$0$82673$ed2619ec@ptn-nntp-reader03.plus.net...
Instead of giving th <TD> a class=head use a <TH> table head- it auto aligns
to center.

Align=center is a bit rusty and now deprecated. In the style give it,
{text-align:center}
that works.

|)e|_

Martin Underwood wrote:
You've told the browser to make the table 100% but then defined a pixel
width for each cell. Unless your browser window is exactly 300 pixels
wide this won't add up.

IE stretches the table out but tries to keep the text within the cell
to the limits specified by the widths. So the text is centered - it's
just centered within the 30 pixel wide area you told the browser to
use. As 30 pixels isn't very much compared to the width of even short
words like Sched and Year, this centering isn't really visible.

So the solution is to delete the widths.

Steve

Del wrote in message
dt5ch8$8ei$1@nwrdmz03.dmz.ncs.ea.ibs-infra.bt.com:


Except that I want to left-align some headings and centralise others. Hence
the absence of an align= (left is assumed) for Surname and Forename and the
presence of it for the other headings.

Again, that would apply to all columns, whereas I want to control it on a
per-cell basis in the header. I suppose I could define two different styles,
headl and headc which are identical apart from the text-align value. Is
there a way in CSS of defining a style (eg td.head) which has the majority
of the attributes, and then define other styles which use this, with
additional attributes?

Something like (wildy inventing my own syntax!):

td.head { loads of attributes }

td.headl { td.head; text-align:left }

td.headc { td.head; text-align:center }


I know that if I define a classless style (eg "td") its attributes are
inherited by all classes of that style (eg "td.head", "td.body" etc). But
I'm talking about inheriting from one class to another.

In the main body of the table, I want if possible to use a classless "td" so
as to keep the size of the PHP-generated HTML as small as possible: a large
number of repetitions of "class=bodyc", "class=bodyc", "class=bodyr" (for
left-, centre- and right-justified text) would significantly increase the
amount of data to be downloaded.

Steve Pugh wrote in message
1140210607.191683.231580@z14g2000cwz.googlegroups. com:

Or increase the widths to the correct value to just accommodate the heading
text in the chosen font. I hadn't noticed those values of 30: now you
mention it, it *is* very small!

If I delete the width attribute for the table, will it automatically take on
a width which is the sum of the colum widths that I define, or must I
calculate the sum of the parts and define this as the table width. I'd
assumed that a table width would be superseded by individual colum widths.

Martin Underwood wrote:

They both work fine in Opera.

I suspect the problem might be with "text-align:general;".

It strikes me that anything marked as <td class="head"> should
probably be marked as <th> instead!

The next question you have to ask is why it is important to specify
the widths. With data tables, in the vast majority of cases, you are
far better off just giving each <td> and <th> some padding - usually
more to the left and right than top and bottom - and letting the
browser get on with it.

--
Stevie D
\\\\\ ///// Bringing dating agencies to the
\\\\\\\__X__/////// common hedgehog since 2001 - "HedgeHugs"
___\\\\\\\'/ \'///////_____________________________________________

Del wrote:

Just to add an AOL there, cos I meant to include that in my post.

If you are going to use CSS, then _use_ CSS. Having deprecated HTML is
bad enough, but if you mix it with CSS then something is bound to go
wrong sooner or later.

--
Stevie D
\\\\\ ///// Bringing dating agencies to the
\\\\\\\__X__/////// common hedgehog since 2001 - "HedgeHugs"
___\\\\\\\'/ \'///////_____________________________________________

Martin Underwood wrote:

That's fine. Define
th, td {text-align:center;}
and
th.left, td.left {text-align:left;}

(assuming you have more centred than lefted - otherwise, swap them
round).

Then you only need to apply a class to fewer than half of them.

I'll repeat it ... if it is a header cell, it should be marked up as
<th>. What you're doing is the equivalent of <p class="heading1">,
which I am sure you would never do.

Not that I'm aware of.
You're better off defining
td.one {most things}
td.two {left}
td.three {right}
and then combining them with <td class="one two"> to change the
alignment of a class one cell.

Find the alignment that is used most and define that as the default.
Then you only need to specify the exceptions.

--
Stevie D
\\\\\ ///// Bringing dating agencies to the
\\\\\\\__X__/////// common hedgehog since 2001 - "HedgeHugs"
___\\\\\\\'/ \'///////_____________________________________________

Martin Underwood wrote:

Just a quick thought - can you define a text-alignment style on a
<col>? Don't know, never tried it, can't investigate for you cos I've
got to run for a train!

--
Stevie D
\\\\\ ///// Bringing dating agencies to the
\\\\\\\__X__/////// common hedgehog since 2001 - "HedgeHugs"
___\\\\\\\'/ \'///////_____________________________________________