CODEWITHSUNDEEP
htmlcsshtml-table
DavidR
DavidR

Reputation: 5388

Formatting text in an html table column?

I have a table like below. Imagine there are multiple columns, I thought by formatting the <col/> tag I would be able to change the formatting of every <td> in that column. I want to give data in the first column a text-align:center, but it doesn't seem to work. Is there a way to get this to work other than adding a class to every <td>? 

<table>
    <col class="column"/>
    <tr> 
        ... 
    </tr>
    <tr> 
        ... 
    </tr>
    <tr> 
        ... 
    </tr>
</table>

Upvotes: 2

Views: 4227

Answers (4)

kelly
kelly

Reputation: 61

The non-css way is to simply add align="center" to your td of the respective column. This is one way where Dreamweaver saves development time: select the entire column, type in center for align and you're done.

Upvotes: 0

Antony
Antony

Reputation: 1461

Give the table a class, e.g. <table class="table1">. Then, in your CSS, you can reference the cells like so:

.table1 tr>td:first-child { text-align:center; }

Upvotes: 2

Matt Mitchell
Matt Mitchell

Reputation: 41823

There's no way to get this to work in all common browsers, but you can use a modern CSS selector to achieve the effect in a standard (if not fully implemented) way.

tr:nth-child(1) { styles }

Where 1 is the first column.

More generally see http://www.w3.org/TR/css3-selectors/#nth-child-pseudo

The common solution is to add a class on each "td" which is usually a non-issue as you're typically generating HTML from other code. I've never seen the col class to which you reference before so did a quick search, and it appears that a) it should be within a colgroup tag and b) it's limited in the styles you can set.

Upvotes: 0

stu
stu

Reputation: 8805

The class covers the tag it is tied to. Since you're closing the tag before doing anything, the class doesn't end up affecting anything. Like the other guy said, put it in the table, which spans all the tds.

Upvotes: 0

Related Questions