Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

Alternate Row Colours on Tables with Inline Style CSS

Alternate Row Colours on Tables with Inline Style CSS

Problem

I want to alternate the background colour of a table to increase readability. After googling a bit I found the code I needed.

tr:nth-child(even) {
    background-color: #000000;
}

The problem in my solution, I don't have access to head tag, and I want to implement this with Inline Style Css, but it doesnt work.

Ideas?

Problem courtesy of: williamwmy

Solution

Inline styles are per-element, so you would have to inject the appropriate styles into the style attribute of every other tr element. If you're not already generating these rows dynamically, and you cannot use JavaScript to inject these styles, then you're stuck with having to manually apply the attribute on each tr element.

Solution courtesy of: BoltClock

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

Alternate Row Colours on Tables with Inline Style CSS

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×