[pmwiki-users] Styling table cells

[Tamara Temple]

On Oct 31, 2013, at 5:48 PM, Ian MacGregor <ardchoille42 at me.com> wrote:
> I haven't been able to find a way to style zebra tables via CSS without resorting to using javascript or CSS3, which many browsers don't yet support.

I don’t know about the browser stats for your site, obviously, but support for the particular CSS3 pseudo-class :nth-child is in all the major browsers currently in use world-wide, except IE < 9, which is getting smaller and smaller. According do the "Can I Use It" site (http://caniuse.com/usage_table.php), IE 8 represents just under 8% of all browser traffic. Granted still a considerable portion, but not most. IE 7 is well under 1%, IE 6 is almost non-existant. But if your user base has a different profile, of course you need to pay most attention to that.

In addition, the javascript shims that create the same effect as the pseudo classes do work on everything out there currently, including IE7 and IE8.

> This works fine until you have to work with tables that have 50+ cells.
> Yes, class=classname does work, but how do you format zebra tables in a CSS file without using CSS3? My research has shown that this isn't possible without javascript or CSS3.

I think you want http://www.pmwiki.org/wiki/Cookbook/AdvancedTableDirectives .  Including that from your cookbook will make the advanced tables use the $Table* variables just like simple tables do, which are explained on http://www.pmwiki.org/wiki/Cookbook/FormattingTables , and add only two lines to your config.php, and however you want to style things to your skin.css or local.css.

I hope that helps!

Tamara

> 
> Regards,
> Rev. Ian MacGregor
> http://www.ianmacgregor.net
> 
>> On Oct 31, 2013, at 3:34 PM, Tamara Temple <tamouse.lists at gmail.com> wrote:
>> 
>> Hi, Ian!
>> 
>>> On Oct 31, 2013, at 3:54 PM, Ian MacGregor <ardchoille42 at me.com> wrote:
>>> Unfortunately I haven't been able to use CSS to style advanced tables, so I'm still styling them by adding styling to each (:cellnr:)/(:cell:). If anyone knows how to do this, and it doesn't require CSS3, I'd enjoy learning what you have to offer.
>> 
>> What is the problem with using CSS to style tables, Ian? You can specify a class on the (:table:) directive, which should give really good control inside a css file:
>> 
>> (:table class="bizzare":)
>> 
>> yields the html:
>> 
>> <table class="bizzare">
>> 
>> which you can select in your css file as:
>> 
>> table.bizzare 
>> 
>> to supply styling for it.
>> 
>> Or do I not understand the issue?
>> 
>>