Grid from HTML Table: text-align issue

[John]

Hi,

I'm creating a Kendo Grid from an existing HTML table. Everything works exactly as I need and expected...with one exception. Text alignment.

My table has a few columns with numeric values and I need these right aligned.

I thought it would be as simple as defining a col like this: <col style="text-align:right;" /> But that doesn't work. Oddly, this works: <col style="width:20px;" />

So, I next tried to format the alignment in the <thead> section, but I couldn't find a solution there.

<th data-field="Total" data-type="number" data-template="#= kendo.toString(Total , 'n0')#">Total</th>

 

I know I could write a template that is applied on a row by row basis, but I don't want to do that. We have a large existing website with lot's of tables and would like to use Kendo UI to replace them...but with minimal dev time.

 

Any ideas? Cheers

[Iliana Dyankova]

Hi John,

The easiest way to achieve this is by using CSS :nth-child selectors. For your convenience here is a basic example.

Regards,
Iliana Nikolova
Telerik by Progress

 

 

[John]

Perfect :) Thanks for the solution. Worked like a charm.