Title: datagrid-header font size Post by: jega on September 16, 2016, 01:30:56 AM This works
<style> .datagrid-cell{ font-size: 14px; } .datagrid-header .datagrid-cell{ font-weight: bold; color: blue; } </style> Changing cell font size Works <style> .datagrid-cell{ font-size: 18px; } .datagrid-header .datagrid-cell{ font-weight: bold; color: blue; } </style> Changing header font size doesn't Work <style> .datagrid-cell{ font-size: 18px; } .datagrid-header .datagrid-cell{ font-weight: bold; color: blue; font-size:18px; } </style> What am i doing wrong ?? Jesper Title: Re: datagrid-header font size Post by: stworthy on September 16, 2016, 05:23:34 AM Please use this code instead.
Code: <style> Title: Re: datagrid-header font size Post by: jega on September 16, 2016, 10:00:43 AM Thanks.
But Can you Explain why font-weight and color works in .datagrid-header .datagrid-cell but font size need also span? Title: Re: datagrid-header font size Post by: iklotzko on September 26, 2016, 01:31:11 PM Jega,
Use the element inspector of your favorite browser. You will see that the header text is wrapped in a span directly under div.datagrid-cell. the div.datagrid-cell selector (in the css file) defines the color and font-weight. However, the div.datagrid-cell span selector defines the font-size. While you can certainly place the font-size in the div.datagrid-cell css, it will be overridden due to css priority definitions. Also, it is an interesting question from a widget design perspective. Why would they do that? There are actually 2 spans inside the datagrid-cell. One of them is reserved for sorting. Right now the sorting uses a sprite image to display direction, but I guess in the future that could change and perhaps a unicode character could be used. It probably makes sense therefore to split out size. But, that is a guess, if not a reach. Not really sure why. |