This is a migrated thread and some comments may be shown as answers.

Group text alignment

4 Answers 72 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Darren
Top achievements
Rank 1
Darren asked on 05 Feb 2013, 05:16 PM
For some reason the grouping text is not aligned properly and I can't figure out why. The text is shifting up. I attached an image of what is happening, and here is the grid definition for the first grid. Can someone please advise on what I can do? Thanks!

<telerik:RadGrid ID="rgSelections" runat="server" AllowPaging="False" AllowSorting="False"
                        AllowMultiRowSelection="false" AutoGenerateColumns="False"
                        HorizontalAlign="NotSet" AllowAutomaticDeletes="False" AllowAutomaticInserts="False"
                        AllowAutomaticUpdates="false" AllowFilteringByColumn="false" ShowGroupPanel="False"
                        Skin="Metro" Height="800">
                        <ClientSettings ReorderColumnsOnClient="false" AllowDragToGroup="false" AllowColumnsReorder="false"
                            AllowRowsDragDrop="false">
                            <Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="true" ScrollHeight="800px">
                            </Scrolling>
                            <Selecting AllowRowSelect="true"></Selecting>
                            <Resizing AllowRowResize="False" AllowColumnResize="False" EnableRealTimeResize="False">
                            </Resizing>
                            <ClientEvents OnRowMouseOver="onRowMouseOver" />
                        </ClientSettings>
                        <MasterTableView DataKeyNames="SlotCode" GridLines="None" AllowMultiColumnSorting="True"
                            AutoGenerateColumns="False" HorizontalAlign="NotSet" CommandItemDisplay="Top"
                            GroupLoadMode="Client">
                            <GroupByExpressions>
                                <telerik:GridGroupByExpression>
                                    <SelectFields>
                                        <telerik:GridGroupByField FieldAlias="ClassDate" FieldName="ClassDate" FormatString="{0:dddd MMMM d}"
                                            HeaderText="Date"></telerik:GridGroupByField>
                                    </SelectFields>
                                    <GroupByFields>
                                        <telerik:GridGroupByField FieldName="ClassDate" SortOrder="Ascending"></telerik:GridGroupByField>
                                    </GroupByFields>
                                </telerik:GridGroupByExpression>
                            </GroupByExpressions>
                            <Columns>
                                <telerik:GridBoundColumn UniqueName="ClassDate" SortExpression="ClassDate" HeaderText="Date"
                                    DataField="ClassDate" DataFormatString="{0:M/dd}" Display="false">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="StartTime" SortExpression="StartTime" HeaderText="Start"
                                    DataField="StartTime" DataFormatString="{0:hh:mm tt}" ItemStyle-Width="60px"
                                    HeaderStyle-Width="60px" ItemStyle-Wrap="false">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="ClassTitleFull" SortExpression="ClassTitleFull"
                                    HeaderText="Class" DataField="ClassTitleFull" ItemStyle-Width="100%" HeaderStyle-Width="100%">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="Seg" SortExpression="Seg" HeaderText="Segment"
                                    DataField="Seg" ItemStyle-Width="60px" HeaderStyle-Width="60px">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn HeaderText="ClassSchedulingID" DataField="ClassSchedulingID"
                                    SortExpression="ClassSchedulingID" UniqueName="ClassSchedulingID" Display="False">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="SlotCode" SortExpression="SlotCode" HeaderText="SlotCode"
                                    DataField="SlotCode" Display="False">
                                </telerik:GridBoundColumn>
                                <telerik:GridButtonColumn UniqueName="Remove" CommandName="Remove" ButtonType="ImageButton"
                                    ImageUrl="images/delete.gif" ItemStyle-Width="30px" HeaderStyle-Width="30px">
                                </telerik:GridButtonColumn>
                            </Columns>
                            <ExpandCollapseColumn Resizable="False" Visible="False">
                                <HeaderStyle Width="20px" />
                            </ExpandCollapseColumn>
                            <RowIndicatorColumn ItemStyle-Width="0px" HeaderStyle-Width="0px" />
                            <CommandItemTemplate>
                            </CommandItemTemplate>
                        </MasterTableView>
                    </telerik:RadGrid>

4 Answers, 1 is accepted

Sort by
0
Kostadin
Telerik team
answered on 08 Feb 2013, 11:03 AM
Hi Darren,

I was not able to reproduce the issue. I prepared a small sample based on your code and attached it to this forum post. Could you please give it a try and let me know how it behaves on your end?

Kind regards,
Kostadin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Darren
Top achievements
Rank 1
answered on 08 Feb 2013, 04:00 PM
I will try it out shortly and let you know. Is there a way to use css to force a margin or something to make it line up? Thanks.
0
Darren
Top achievements
Rank 1
answered on 11 Feb 2013, 04:40 PM
I found that the issue is that I am using a CSS Reset, and the following was the culprit:

vertical-align: baseline

Is there a way to still use my reset but override the grouping css style?

Thanks!
0
Accepted
Kostadin
Telerik team
answered on 13 Feb 2013, 10:13 AM
Hello,

Could you please try the following CSS rule and let me know about the result?
.RadGrid .rgGroupHeader td div div div {
    margin-top: 15px;
}

All the best,
Kostadin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Grid
Asked by
Darren
Top achievements
Rank 1
Answers by
Kostadin
Telerik team
Darren
Top achievements
Rank 1
Share this question
or