Put Separator in RadToolBar

[Hardik]

I want to add Separator in RadToolBar as per attached screenshot

<telerik:RadToolBar ID="accoADEGridToolBar" runat="server"
                            OnClientButtonClicking="onToolBarClientButtonClicking"
                            AutoPostBack="true"
                            Width="99.50%" OnClientLoad="onToolBarClientLoad" OnLoad="accoADEGridToolBar_Load">
                            <Items>
                                <telerik:RadToolBarButton Text="Refresh" CommandName="RebindGrid" ImageUrl="Images/Refresh.gif">
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarDropDown CssClass="drp_selectedMode" Text="Edit Mode:" >
                                    <Buttons>
                                        <telerik:RadToolBarButton CssClass="drp_BatchEditMode" Text="Batch" Value="Batch" CommandName="Batch"></telerik:RadToolBarButton>
                                        <telerik:RadToolBarButton CssClass="drp_EditFormsEditMode" Text="Embedded Form" Value="Embedded Form" CommandName="EditForms"></telerik:RadToolBarButton>
                                        <telerik:RadToolBarButton CssClass="drp_InPlaceEditMode" Text="Inline" Value="Inline" CommandName="InPlace"></telerik:RadToolBarButton>
                                        <telerik:RadToolBarButton CssClass="drp_PopUpEditMode" Text="Modal Dialog" Value="Modal Dialog" CommandName="PopUp"></telerik:RadToolBarButton>
                                    </Buttons>
                                </telerik:RadToolBarDropDown>
                                <telerik:RadToolBarButton Text="Edit selected" CommandName="EditSelected" ImageUrl="Images/Edit.gif" Visible='<%# accoADEGrid.EditIndexes.Count == 0 && accoADEGrid.MasterTableView.EditMode != GridEditMode.Batch %>'>
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Save changes" CommandName="UpdateEdited" ImageUrl="Images/Update.gif" Visible='<%# accoADEGrid.EditIndexes.Count > 0 %>'>
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Save pending changes" CommandName="SaveChanges" PostBack="false" ImageUrl="Images/Update.gif" Visible='<%# accoADEGrid.MasterTableView.EditMode == GridEditMode.Batch %>'>
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Insert new row" PostBack="<%# accoADEGrid.MasterTableView.EditMode != GridEditMode.Batch %>" CommandName="InitInsert" ImageUrl="Images/AddRecord.gif" Visible='<%# !accoADEGrid.MasterTableView.IsItemInserted %>'>
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Save new row" CommandName="PerformInsert" ImageUrl="Images/Insert.gif" Visible='<%# accoADEGrid.MasterTableView.IsItemInserted %>'>
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Cancel (all)" CommandName="CancelAll" ImageUrl="Images/Cancel.gif" Visible='<%# accoADEGrid.EditIndexes.Count > 0 || accoADEGrid.MasterTableView.IsItemInserted %>'>
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Cancel pending changes" CommandName="CancelChanges" ImageUrl="Images/Cancel.gif" Visible='<%# accoADEGrid.MasterTableView.EditMode == GridEditMode.Batch %>'>
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Delete selected" CommandName="DeleteSelected" ImageUrl="Images/Delete.gif" Visible="<%# accoADEGrid.MasterTableView.EditMode != GridEditMode.Batch %>">
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Show child items" CommandName="ShowLinkedInstance" ImageUrl="Images/Edit.gif" Enabled="false" Visible='<%# liID.Value != "" && !this.Page.ClientQueryString.Contains("RelationID") %>'>
                                </telerik:RadToolBarButton>
                                
                                <telerik:RadToolBarButton PostBack="false" Text="Show Query" OuterCssClass="rightButton showHideQueries" CommandName="ShowQuery" ImageUrl="Images/Refresh.gif" Enabled="true" ClientIDMode="Static"></telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Excel Export" OuterCssClass="rightButton" CommandName="ExportToExcel" ImageUrl="Images/Edit.gif" Enabled="true" ClientIDMode="AutoID">
                                </telerik:RadToolBarButton>
                                <telerik:RadToolBarButton Text="Fullscreen" OuterCssClass="rightButton OpenInFullscreen" CommandName="Fullscreen" ImageUrl="Images/Fullscreen.png" Enabled="true" ClientIDMode="AutoID" Visible='<%# ( Request.QueryString["DisplayMode"] != null && Request.QueryString["DisplayMode"] == "WebPart") %>'>
                                </telerik:RadToolBarButton>
                            </Items>
                        </telerik:RadToolBar>

[Magdalena]

Hi Hardik,

By setting the property IsSeparator to true, the button will be displayed as separator.

<telerik:RadToolBarButton IsSeparator="true"></telerik:RadToolBarButton>

You can find more detailed information in this article.

Regards,
Magdalena
Progress Telerik