user34537
user34537

Reputation:

Apply style to column in a table?

Is it possible to apply a style to a column? for example lets say I want the 2nd column to be red (in reality it'd be more complicated). Below/this demo I gave the 2nd column the class b but I have no idea how to make the 2nd column of every row red. I only know how to style the header

.b { color: red; }

<table>
    <th>a</th>
    <th class="b">b</th>
    <th>a</th>
    <tbody>
        <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        </tr>
        <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        </tr>
        <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        </tr>
        <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        </tr>
    </tbody>
</table>

Upvotes: 2

Views: 544

Answers (2)

Karuppiah RK
Karuppiah RK

Reputation: 3964

Use nth-child

tbody tr td:nth-child(2){color: red;}

Demo JsFiddle

Upvotes: 3

Nikolay Talanov
Nikolay Talanov

Reputation: 717

http://jsfiddle.net/EEJfc/3/

Use nth-child selector.

In your case

table td:nth-child(2) { color: red }

Upvotes: 7

Related Questions