There is a CSS property "padding-right: 6px" when displaying only an icon in a ListGrid header field. This extra padding to the right seems to be used for a gap between the icon and title (text). I was wondering if there was a method/property to remove that padding so that the icon will look centered? Our expected result is only a single icon, center-aligned in the ListGrid header field. Currently, our icon in the header field has 6px extra padding on the right even though the title is not there. This was reproduced in the SmartClient Feature Explorer.
Note: I set title property to a string with a single space to hide the title.
1. SmartClient Version: v9.1p_2015-03-26/Pro Development Only (built 2015-03-26)
2. Browsers involved: Google Chrome Version 43.0.2357.125 (64-bit) and Firefox 37.0.1
3. Reproduced using SmartClient Feature Explorer:
http://www.smartclient.com/docs/9.0/a/system/reference/SmartClient_Explorer.html#listsListGridFields
Using the following code:
Note: I set title property to a string with a single space to hide the title.
1. SmartClient Version: v9.1p_2015-03-26/Pro Development Only (built 2015-03-26)
2. Browsers involved: Google Chrome Version 43.0.2357.125 (64-bit) and Firefox 37.0.1
3. Reproduced using SmartClient Feature Explorer:
http://www.smartclient.com/docs/9.0/a/system/reference/SmartClient_Explorer.html#listsListGridFields
Using the following code:
Code:
isc.ListGrid.create({
ID: "countryList",
width:500, height:224, alternateRecordStyles:true,
fields:[
{name:"", icon: "http://www.smartclient.com/favicon.ico", title: " " , showValueIconOnly: "true"},
{name:"countryName", title:"Country"},
{name:"independence", title:"Nationhood", type:"date"},
{name:"population", title:"Population", type:"integer"},
{name:"gdp", title:"GDP", type:"float"}
],
data: countryData
})