Skinning YUI Data Table

we do generally think skinning any css thing is very easy, I started skinning YUI data table with the same assumption, but what turned out is my assumption was wrong, it needed bit more that css sense, that is cascading sense. the better understanding of data table. Finally I am done with that, here is the css for skinning your data table to purple color. append it to your skin.css (inside /assets/skin/sam/ folder)

.yui-skin-sam tr.yui-dt-odd {background-color:#f1edff;}
.yui-skin-sam tr.yui-dt-odd td.yui-dt-asc{background-color:#e5dbff;}
.yui-skin-sam tr.yui-dt-even td.yui-dt-asc{background-color:#f1edff;}
.yui-skin-sam tr.yui-dt-highlighted{background-color:#c6b2ff;}
.yui-skin-sam tr.yui-dt-highlighted td, .yui-skin-sam tr.yui-dt-highlighted td.yui-dt-asc, .yui-skin-sam tr.yui-dt-highlighted td.yui-dt-desc{background-color:#c6b2ff;}
.yui-skin-sam tr.yui-dt-selected{background-color:#7c42d9;}
.yui-skin-sam tr.yui-dt-selected td, .yui-skin-sam tr.yui-dt-selected td.yui-dt-asc, .yui-skin-sam tr.yui-dt-selected td.yui-dt-desc {background-color:#7c42d9;}

make sure you won’t mess with the order, order is more important than the content.

check out preview image @ http://www.flickr.com/photos/ananthara/4202372041/