UI Grid : Header not align with the column

[dtalvard]

Hello,

I'm using AngularJS 1.5.3 with the angular-ui-grid 3.1.1.
As I'm new to UI-Grid I started from the examples in the API documentation, but I'm having the following issue, on every browsers I'm using (last version of chrome, firefox, IE11) :
the column headers seems to be sized with the contents, so I'm having all my headers on the left and a big space on the right but all the columns are sharing the same size.

I tried with differents sizes on the gridOptions.ColumnDef such as " width : '*' ", " width: 100 " or " width: '20%' ", but I'm having always the same result : the column are getting the right width defined but the column headers are not.

I also tried using the headerTemplate attribute with the header example in the documentation but it also isn't changing anything.

For information, I'm also using CSS3 Flex (but it shouldn't be a problem) and I'm also having the error : "getSafeText is not a function".

Thank you for your help.

[LakhanK]

I had the same problem I have one css fix for it.

.ui-grid-header-cell {float: left;}