How do I align the text inside a td element?

Why is there no replacement for td align attribute?

Why doesn't text-align:right ever seem to work for me?

I can't get correct table layout with Css. The left column should have
text aligned to the right of the td column. It's aligned to the left.
I can get the effect I want by giving every td tag the align="right"
attibute, which breaks xhtml compliance. Presumable I could also put
some filler tags inside the td element and apply a style to that - it
looks even more evil than the first solution but is xhtml compliant.

I there there really no simple way to apply a style to the td element
itself?

Here is the start of my table:

<table class="myFund w900">
<colgroup>
<col id="description" />
<col id="content" />
</colgroup>
<thead>
<tr>
<th colspan="2" style="line-height:1px;"></th>
</tr>
</thead>
<tbody>
<tr>
<td>Name</td>
<td>blah ... contains 2 asp.net controls ...</td>
</tr>
...
</table>

I have these Css definitions:

col#description {width:16%; text-align:right;}
col#content {width:82%; text-align:left; height:15px;}

When I look at the detail of the html in Firefox it shows these styles
are attached to the <td>Name</td> code:

/* firefox shows td has: */
td {
padding:2px;
vertical-align:top;
}

/* plus: Inherited from body */
body {
font-family:Verdana;
font-size:0.7em;
}

The style information from the col must also be applied because the
relative column widths are about 16:82 but text-align:right; is doing
nothing.

I have tried viewing this in Firefox, Chrome, Ie8 and Safari (most
recent versions runing on winXP).

Gazing into my crystal ball I observed "mark4asp" <mark4asp (AT) gmail (DOT) com>
writing in news:00682915$0$22124$c3e8da3 (AT) news (DOT) astraweb.com:

Why is there no replacement for td align attribute?

Why doesn't text-align:right ever seem to work for me?

I can't get correct table layout with Css. The left column should have
text aligned to the right of the td column. It's aligned to the left.
I can get the effect I want by giving every td tag the align="right"
attibute, which breaks xhtml compliance. Presumable I could also put
some filler tags inside the td element and apply a style to that - it
looks even more evil than the first solution but is xhtml compliant.

I there there really no simple way to apply a style to the td element
itself?

Here is the start of my table:

table class="myFund w900"
colgroup
col id="description" /
col id="content" /
/colgroup
thead
tr
th colspan="2" style="line-height:1px;"></th
/tr
/thead
tbody
tr
td>Name</td
td>blah ... contains 2 asp.net controls ...</td
/tr
...
/table

I have these Css definitions:

col#description {width:16%; text-align:right;}
col#content {width:82%; text-align:left; height:15px;}

When I look at the detail of the html in Firefox it shows these styles
are attached to the <td>Name</td> code:

/* firefox shows td has: */
td {
padding:2px;
vertical-align:top;
}

/* plus: Inherited from body */
body {
font-family:Verdana;
font-size:0.7em;
}

The style information from the col must also be applied because the
relative column widths are about 16:82 but text-align:right; is doing
nothing.

I have tried viewing this in Firefox, Chrome, Ie8 and Safari (most
recent versions runing on winXP).

That's because the col element only takes width. You would be better off
classing the td elements themselves, especially since you are looping
through records.

<style type="text/css">
td.right {text-align:right}
</style>
<-- set up your loop -->
<td class="right"><!-- content --></td>
<!-- remaining loop -->

--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

On 2009-06-01, mark4asp <mark4asp (AT) gmail (DOT) com> wrote:

Why is there no replacement for td align attribute?

Why doesn't text-align:right ever seem to work for me?

I can't get correct table layout with Css. The left column should have
text aligned to the right of the td column. It's aligned to the left.
I can get the effect I want by giving every td tag the align="right"
attibute, which breaks xhtml compliance.

Instead give each td in the right hand column some kind of class,
class="right" or something [more meaningful etc.]

Then use td.right { text-align: right }

[...]

I there there really no simple way to apply a style to the td element
itself?

Yes, but don't use COL.

[...]

col#description {width:16%; text-align:right;}
col#content {width:82%; text-align:left; height:15px;}

[...]
The style information from the col must also be applied because the
relative column widths are about 16:82 but text-align:right; is doing
nothing.

You're right that what you're trying to do is partially working, but
this is confusing.

COL is meant to be a bucket for HTML attributes, not for CSS properties,
so I don't think what you're doing should work at all. Styling the COL
element with CSS selectors ought to do nothing as it isn't displayed
itself.

But I think <col style="text-align: right"> ought to work-- that style
attribute should end up on the cells in the column-- but it doesn't in
Firefox or Opera, so I am either wrong, or right but academic.

If you want to use CSS, get it to select the tds with a selector (for
example a class selector as suggested above), and don't use COL.

mark4asp wrote:

Why is there no replacement for td align attribute?

Why doesn't text-align:right ever seem to work for me?

[ snip ]

I have these Css definitions:

col#description {width:16%; text-align:right;}
col#content {width:82%; text-align:left; height:15px;}

When I look at the detail of the html in Firefox it shows these styles
are attached to the <td>Name</td> code:

/* firefox shows td has: */
td {
padding:2px;
vertical-align:top;
}

/* plus: Inherited from body */
body {
font-family:Verdana;
font-size:0.7em;
}

The style information from the col must also be applied because the
relative column widths are about 16:82 but text-align:right; is doing
nothing.

I have tried viewing this in Firefox, Chrome, Ie8 and Safari (most
recent versions runing on winXP).

With that same element ( <td>Name</td> ) selected in FireFox, when I
look at the DOM tab it shows:

align "left"

Note: The original inherited style was caused by this definition in my
stylesheet:

td {padding:2px; vertical-align:top;}

mark4asp wrote:

Why doesn't text-align:right ever seem to work for me?

I can get the effect I want by applying the style directly to the td
element. I won't work via the col element - although, annoyingly, the
css attribute width works through either.

This seems to be the case for all browsers.

Is this in the CSS definition? If so it seems perculiarly warped.

Lets add something to html which allows us to apply a
style to an entire table column. But lets cripple it
so, in practice, it's next to useless.

Manuel Collado wrote:

mark4asp escribió:
mark4asp wrote:

Why doesn't text-align:right ever seem to work for me?

I can get the effect I want by applying the style directly to the td
element. I won't work via the col element - although, annoyingly,
the css attribute width works through either.

This seems to be the case for all browsers.

Is this in the CSS definition? If so it seems perculiarly warped.

Lets add something to html which allows us to apply a
style to an entire table column. But lets cripple it
so, in practice, it's next to useless.

td {width:16%; text-align:right;} /* first column*/
td + td {width:82%; text-align:left; height:15px;} /*second column*/

(requires CSS2)

Thanks to Michael and whoever else replied. I didn't actually know this
bit of CSS

Perhaps I read about it a few years ago and dismissed it because it was
CSS2.

mark4asp wrote:

Manuel Collado wrote:

mark4asp escribió:
mark4asp wrote:

Why doesn't text-align:right ever seem to work for me?
I can get the effect I want by applying the style directly to the td
element. I won't work via the col element - although, annoyingly,
the css attribute width works through either.

This seems to be the case for all browsers.

Is this in the CSS definition? If so it seems perculiarly warped.

Lets add something to html which allows us to apply a
style to an entire table column. But lets cripple it
so, in practice, it's next to useless.
td {width:16%; text-align:right;} /* first column*/
td + td {width:82%; text-align:left; height:15px;} /*second column*/

(requires CSS2)


Thanks to Michael and whoever else replied. I didn't actually know this
bit of CSS

Perhaps I read about it a few years ago and dismissed it because it was
CSS2.

The support is wider now, because of older browsers falling on the

ash heap.

Note that this (I believe) and first-child (I'm sure), as well as >
will not work in IE6 without a patch.

Ah, here it is:

http://www.quirksmode.org/css/contents.html

Jeff

dorayme wrote:

In article <C7WUl.30988$yr3.12243 (AT) nlpi068 (DOT) nbdc.sbc.com>,
Jeff <jeff_thies (AT) att (DOT) net> wrote:

http://www.quirksmode.org/css/contents.html

An interesting table heading on that page "IE8 as IE8"! <g

I did not see, on a quick look, whether Ben predictions has been
documented on the page yet. The interesting prediction was that IE8 as
IE7 would have its own bugs.

Like we need another IE problem.

Regrettably I just suggested to a friend that she use IE instead of
FireFox on her old laptop with 240 megs of memory (I bumped it up from
120). I've got all of them loaded here and FF uses, by far, the most
memory. Opera was 5 megs less than IE, but I couldn't get her to load that.

I'm still happy running IE6 as IE7 (css wise), you can also run it as
IE8.

IE8 has some issues IE7 doesn't, did you catch Yukkas thread on that? I
don't remember whether it was here or alt.www.webmaster

Jeff

This is probably a true prediction, only

the severity of it being an unknown. <g

On Mon, 1 Jun 2009, mark4asp wrote:

body {
font-family:Verdana;
font-size:0.7em;

This is stupid - incredibly stupid!

I have chosen Verdana as my preferred typeface in my browser
and I have chosen a suitable font size so that I can read text
conveniently. Now you reduce the font size by 30% so that
I have problems reading.

Why do you want that readers cannot read your text?

Only morons write
body { font-size: 0.7em }

--
In memoriam Alan J. Flavell
http://www.alanflavell.org.uk/charset/

dorayme wrote:

In article
Pine.LNX.4.64.0906021043530.26324 (A...ni-hannover.de>,
Andreas Prilop <prilop4321 (AT) trashmail (DOT) net> wrote:

On Mon, 1 Jun 2009, mark4asp wrote:

body {
font-family:Verdana;
font-size:0.7em;
This is stupid - incredibly stupid!

I have chosen Verdana as my preferred typeface in my browser
and I have chosen a suitable font size so that I can read text
conveniently. Now you reduce the font size by 30% so that
I have problems reading.

Why do you want that readers cannot read your text?

Only morons write
body { font-size: 0.7em }

Being unwise and ignorant, last time I thought about this, does not mean
that someone is a moron. But presumably, there are deeper considerations
I miss.

They are only morons if they are told why this is bad practice but
*insist* on doing it anyway. Unfortunately it has been evident in too
many threads in the past.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com