1 Reply Latest reply on Mar 13, 2008 4:39 PM by Scott McAllister

    align DataGrid header differently than data

    skrame
      I am new to Flex and am trying to set the alignment on the header of a DataGrid to "center" and right-align the data in some of the columns but cannot get this to work. Settiing the "headerStyleName" property doesn't work for 'text-align:center'. Any help is greatly appreciated.

      <?xml version="1.0"?>
      <!-- DataGrid control example. -->
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">
      <mx:Style>
      .headerStyle
      {font-weight:bold;
      font-size: 15;
      text-align:center;
      color:blue;}
      </mx:Style>
      <mx:XMLList id="employees">
      <employee>
      <name>Christina Coenraets</name>
      <phone>555-219-2270</phone>
      <email>ccoenraets@fictitious.com</email>
      <salary>$55,000</salary>
      <active>true</active>
      </employee>
      <employee>
      <name>Joanne Wall</name>
      <phone>555-219-2012</phone>
      <email>jwall@fictitious.com</email>
      <salary>$47,000</salary>
      <active>true</active>
      </employee>
      </mx:XMLList>
      <mx:Panel title="DataGrid Control Example" height="100%" width="100%"
      paddingTop="10" paddingLeft="10" paddingRight="10">

      <mx:Label width="100%" color="blue"
      text="Select a row in the DataGrid control."/>

      <mx:DataGrid id="dg" width="100%" height="100%" rowCount="5" headerStyleName="headerStyle" dataProvider="{employees}">
      <mx:columns>
      <mx:DataGridColumn dataField="name" headerText="Name"/>
      <mx:DataGridColumn dataField="phone" headerText="Phone"/>
      <mx:DataGridColumn dataField="email" headerText="Email"/>
      <mx:DataGridColumn dataField="salary" headerText="Salary" textAlign="right"
      headerStyleName="headerStyle" />
      </mx:columns>
      </mx:DataGrid>
      </mx:Panel>
      </mx:Application>