Datepicker width rendering issue in Safari and Chrome filter

[Dan]

I have a grid with a date column.  Here is the code:

<telerik:RadGrid ID="grdEvaluations" runat="server"                 
                AllowAutomaticDeletes="True" Width="790px" 
                AllowFilteringByColumn="True" AllowPaging="True" AllowSorting="True" 
                AutoGenerateColumns="False" AutoGenerateDeleteColumn="True" 
                AutoGenerateEditColumn="True" CellSpacing="0" DataSourceID="sqlEvaluations" 
                GridLines="None" PageSize="20"><MasterTableView DataKeyNames="EvaluationsKey" DataSourceID="sqlEvaluations" CommandItemDisplay="Top"><CommandItemSettings ExportToPdfText="Export to PDF" /><RowIndicatorColumn FilterControlAltText="Filter RowIndicator column" 
                        Visible="True"><HeaderStyle Width="20px" /></RowIndicatorColumn><ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column" 
                        Visible="True"><HeaderStyle Width="20px" /></ExpandCollapseColumn><Columns>
                            <telerik:GridBoundColumn DataField="EvaluationsKey" DataType="System.Int32"  
                            Display="False" FilterControlAltText="Filter EvaluationsKey column" 
                            HeaderText="EvaluationsKey" ReadOnly="True" SortExpression="EvaluationsKey" 
                            UniqueName="EvaluationsKey" AllowFiltering="False"></telerik:GridBoundColumn><telerik:GridDropDownColumn DataField="OfficialID" DataSourceID="sqlOfficials" 
                            FilterControlAltText="Filter OfficialDDL column" HeaderText="Official" 
                            ListTextField="Comment" ListValueField="username" UniqueName="OfficialID" 
                            FilterControlToolTip="Filter by OfficialID" 
                            FilterImageToolTip="Filter by OfficialID"></telerik:GridDropDownColumn>
                            <telerik:GridDateTimeColumn DataField="EvalDate" DataFormatString="{0:d}" 
                            FilterControlAltText="Filter EvalDate column" HeaderText="Eval Date" 
                            UniqueName="EvalDate">
                                <HeaderStyle Width="150px" />
                                <ItemStyle Width="150px" />
                            </telerik:GridDateTimeColumn><telerik:GridDropDownColumn DataField="EvaluatorID" DataSourceID="sqlOfficials" 
                            FilterControlAltText="Filter Evaluator column" 
                            FilterControlToolTip="Filter by OfficialID" 
                            FilterImageToolTip="Filter by OfficialID" HeaderText="Evaluator" 
                            ListTextField="Comment" ListValueField="username" UniqueName="EvaluatorID"></telerik:GridDropDownColumn><telerik:GridTemplateColumn AllowFiltering="False" DataField="FilePath" 
                            FilterControlAltText="Filter FilePath column" HeaderText="Evaluation Sheet" 
                            UniqueName="FilePath"><EditItemTemplate><asp:HyperLink ID="hylFilePath" runat="server" NavigateUrl='<%# "~/FileUploads/Evals/" & Eval("FilePath") %>'></asp:HyperLink></EditItemTemplate><InsertItemTemplate>* Max File Size is 200 Kb <telerik:RadAsyncUpload  OnFileUploaded="uplFilePathInsert_OnFileUploaded" ID="uplFilePathInsert" runat="server" MaxFileInputsCount="1" TargetFolder="~/FileUploads/Evals/" MaxFileSize="204800" ToolTip="File size must be less than 200 Kb"></telerik:RadAsyncUpload></InsertItemTemplate><ItemTemplate><asp:HyperLink ID="hylFilePath" runat="server" NavigateUrl='<%# "~/FileUploads/Evals/" & Eval("FilePath") %>'></asp:HyperLink><asp:Label ID="lblFilePath" runat="server" Text='<%# Eval("FilePath") %>' Visible="false"></asp:Label></ItemTemplate></telerik:GridTemplateColumn><telerik:GridBoundColumn AllowFiltering="False" DataField="Comment" 
                            FilterControlAltText="Filter Comment column" HeaderText="Comment" 
                            SortExpression="Comment" UniqueName="Comment"></telerik:GridBoundColumn></Columns><EditFormSettings><EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn></EditFormSettings></MasterTableView><FilterMenu EnableImageSprites="False"></FilterMenu></telerik:RadGrid>

The grid renders properly and everything looks great in IE and FireFox.  However in Safari and Chrome the column width for the Eval Date column is HUGE.  If I set AllowFilter="False" for the EvalDate column the grid looks good in Safari and Chrome again.

Is there a work-around for this and is this a known bug?

Thanks,

Dan

[Kostadin]

Hello Dan,

This is a known issue in WebKit browsers. A possible solution is to use the FilterControlWidth property of the GridDateTimeColumn to define the width dimension of the filter control. Note that you have to set the width in pixels, not in percentage.

All the best,
Kostadin
the Telerik team

[Dan]

Thanks; I'll make that change.