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

Setting margin

2 Answers 122 Views
Splitter
This is a migrated thread and some comments may be shown as answers.
Matt
Top achievements
Rank 1
Matt asked on 08 Jul 2010, 08:26 PM
I have a RadPane that in the grand scheme of things serves as the content panel on the page. I would like to set a 10px margin for all content in this pane (so that there is a little room between other panes). How can I do this such that the width of the contents do not extend beyond the defined width of the content pane?

Below is a snippet of code, where RadPane8 represents the content pane.

<telerik:RadSplitter ID="RadSplitter2" runat="server" SplitBarsSize="" Orientation="Horizontal">
    <telerik:RadPane ID="RadPane3" runat="server" Height="26px">
        <telerik:RadMenu ID="radToolbar" runat="server" EnableSelection="False">
        </telerik:RadMenu>
    </telerik:RadPane>
    <telerik:RadPane ID="RadPane8" runat="server">
        <asp:Panel ID="pnlClaimSummary" runat="server" Visible="False">
            <telerik:RadSplitter ID="RadSplitter7" runat="server" Orientation="Horizontal">
                <telerik:RadPane ID="RadPane13" runat="server" Height="55px">
                    <table style="width: 100%;" cellspacing="0" border="0">
                        <tr>
                            <td colspan="4" class="rgHeader" scope="col">
                                Claim Details
                            </td>
                        </tr>
                        <tr class="rgFilterRow">
                            <td style="width: 25%;">
                                <span class="InquiryLevel1">Claim Number: </span>
                                <asp:Label ID="lblClaimSummaryClaimNumber" runat="server" Text="Label"></asp:Label>
                            </td>
                            <td style="width: 25%;">
                                <span class="InquiryLevel1">Policy Number: </span>
                                <asp:Label ID="lblClaimSummaryPolicyNumber" runat="server" Text="Label"></asp:Label>
                            </td>
                            <td style="width: 25%;">
                                <span class="InquiryLevel1">Loss Date: </span>
                                <asp:Label ID="lblClaimSummaryLossDate" runat="server" Text="Label"></asp:Label>
                            </td>
                            <td style="width: 25%;">
                                <span class="InquiryLevel1">Occurrence: </span>
                                <asp:Label ID="lblClaimSummaryLossOccurrence" runat="server" Text="Label"></asp:Label>
                            </td>
                        </tr>
                    </table>
                </telerik:RadPane>
                <telerik:RadPane ID="RadPane14" runat="server">
                    <telerik:RadSplitter ID="RadSplitter8" runat="server">
                        <telerik:RadPane ID="RadPane15" runat="server">
                            <table>
                                <tr>
                                    <td>
                                        <span class="InquiryLevel1">Loss Description:</span>
                                    </td>
                                    <td>
                                        <telerik:RadTextBox ID="txtLossDescription" runat="server" ReadOnly="True" TextMode="MultiLine"
                                            Rows="5">
                                        </telerik:RadTextBox>
                                    </td>
                                </tr>
                            </table>
                        </telerik:RadPane>
                        <telerik:RadPane ID="RadPane16" runat="server">
                            <telerik:RadGrid ID="grdClaimAssignment" runat="server" AllowSorting="True" AutoGenerateColumns="False"
                                GridLines="None" OnNeedDataSource="grdClaimAssignment_NeedDataSource">
                                <MasterTableView>
                                    <RowIndicatorColumn>
                                        <HeaderStyle Width="20px" />
                                    </RowIndicatorColumn>
                                    <ExpandCollapseColumn>
                                        <HeaderStyle Width="20px" />
                                    </ExpandCollapseColumn>
                                    <Columns>
                                        <telerik:GridBoundColumn DataField="Name" HeaderText="Assignee Name" UniqueName="AssigneeName">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn DataField="Role" HeaderText="Role" UniqueName="AssignmentRole">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn DataField="WhenAssigned" DataType="System.DateTime" HeaderText="Assignment Date"
                                            UniqueName="WhenAssigned">
                                        </telerik:GridBoundColumn>
                                    </Columns>
                                </MasterTableView>
                            </telerik:RadGrid>
                        </telerik:RadPane>
                    </telerik:RadSplitter>
                </telerik:RadPane>
            </telerik:RadSplitter>
        </asp:Panel>
        <asp:Panel ID="pnlDashboard" runat="server" Visible="False">
            <telerik:RadSplitter ID="RadSplitter5" runat="server" Orientation="Horizontal">
                <telerik:RadPane ID="radItemListPane" runat="server">
                    <telerik:RadGrid ID="radDashGrid" runat="server" AllowFilteringByColumn="True" AllowSorting="True"
                        GridLines="None" Style="margin: 10px;" OnItemDataBound="radDashGrid_ItemDataBound"
                        AutoGenerateColumns="False" OnItemCommand="radDashGrid_ItemCommand" OnPreRender="radDashGrid_PreRender"
                        OnNeedDataSource="radDashGrid_NeedDataSource">
                        <MasterTableView DataKeyNames="ItemID">
                            <Columns>
                                <telerik:GridBoundColumn DataField="ClaimNumber" HeaderText="Claim Number" UniqueName="ClaimNumber">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="PolicySymbol" HeaderText="Symbol" UniqueName="PolicySymbol">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="PolicyNumber" HeaderText="Policy Number" UniqueName="PolicyNumber">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="DateOfLoss" DataFormatString="{0:MM/dd/yyyy}"
                                    DataType="System.DateTime" HeaderText="Loss Date" UniqueName="DateOfLoss">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="LossOccurrence" HeaderText="Occurrence" UniqueName="column1"
                                    DataFormatString="{0:D2}" DataType="System.Int32">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="ItemType" HeaderText="Item Type" UniqueName="ItemType">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="DueDate" DataFormatString="{0:MM/dd/yyyy hh:mm tt}"
                                    DataType="System.DateTime" HeaderText="Due Date" UniqueName="DueDate">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="IsRead" DataType="System.Boolean" HeaderText="Read"
                                    UniqueName="IsRead" Visible="False" AllowFiltering="False" AllowSorting="False"
                                    Display="False" Groupable="False" Reorderable="False" Resizable="False" ShowSortIcon="False">
                                </telerik:GridBoundColumn>
                            </Columns>
                            <SortExpressions>
                                <telerik:GridSortExpression FieldName="DueDate" SortOrder="Ascending" />
                            </SortExpressions>
                        </MasterTableView>
                        <ClientSettings EnablePostBackOnRowClick="True" EnableRowHoverStyle="True">
                            <Selecting AllowRowSelect="True" />
                            <ClientEvents OnRowContextMenu="ShowDashboardContextMenu" />
                        </ClientSettings>
                    </telerik:RadGrid>
                </telerik:RadPane>
                <telerik:RadSplitBar ID="RadSplitBar2" runat="server" CollapseMode="Forward">
                </telerik:RadSplitBar>
                <telerik:RadPane ID="RadPane11" runat="server" Height="100%">
                    <asp:Panel ID="pnlDashboardDetailsContainer" runat="server">
                        <asp:Panel ID="pnlDashboardItemDetails" runat="server" Visible="false" Style="margin: 10px;"
                            CssClass="RadGrid RadGrid_WebBlue">
                            <table style="width: 100%;" cellspacing="0" border="0">
                                <tr>
                                    <td colspan="4" class="rgHeader" scope="col">
                                        Suspense Details
                                    </td>
                                </tr>
                                <tr class="rgFilterRow">
                                    <td style="width: 25%;">
                                        <span class="InquiryLevel1">Claim Number: </span>
                                        <asp:LinkButton ID="lnkClaimNumber" runat="server" CssClass="lkNorm" OnCommand="lnkClaimNumber_Command">ClaimNumber</asp:LinkButton>
                                    </td>
                                    <td style="width: 25%;">
                                        <span class="InquiryLevel1">Policy Number: </span>
                                        <asp:Label ID="lblPolicyNumber" runat="server" Text="Label"></asp:Label>
                                    </td>
                                    <td style="width: 25%;">
                                        <span class="InquiryLevel1">Loss Date: </span>
                                        <asp:Label ID="lblLossDate" runat="server" Text="Label"></asp:Label>
                                    </td>
                                    <td style="width: 25%;">
                                        <span class="InquiryLevel1">Occurrence: </span>
                                        <asp:Label ID="lblOccurrence" runat="server" Text="Label"></asp:Label>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="4">
                                        <div style="margin-top: 10px;">
                                            <table>
                                                <tr>
                                                    <td>
                                                        <span class="InquiryLevel1">Date Sent:</span>
                                                    </td>
                                                    <td>
                                                        <telerik:RadDateInput ID="txtDateSent" runat="server" DateFormat="MM/dd/yyyy" DisplayDateFormat="MM/dd/yyyy"
                                                            ReadOnly="True" SelectedDate="06/28/2010" Width="175">
                                                        </telerik:RadDateInput>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <span class="InquiryLevel1">Sender:</span>
                                                    </td>
                                                    <td>
                                                        <telerik:RadTextBox ID="txtFrom" runat="server" Text="Person" Width="300" ReadOnly="True">
                                                        </telerik:RadTextBox>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <span class="InquiryLevel1">Message:</span>
                                                    </td>
                                                    <td>
                                                        <telerik:RadTextBox ID="txtMessage" runat="server" ReadOnly="True" TextMode="MultiLine"
                                                            Rows="6" Width="500" Text="Review information to ensure accuracy.">
                                                        </telerik:RadTextBox>
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>
                                    </td>
                                </tr>
                            </table>
                        </asp:Panel>
                    </asp:Panel>
                </telerik:RadPane>
            </telerik:RadSplitter>
        </asp:Panel>
    </telerik:RadPane>
</telerik:RadSplitter>

2 Answers, 1 is accepted

Sort by
0
Matt
Top achievements
Rank 1
answered on 09 Jul 2010, 02:44 PM
I was able to address the problem by wrapping all of the content in a table, where the margin of the table is 10px. It's amazing what a little time away from things will do to clear the mind.
0
Dobromir
Telerik team
answered on 13 Jul 2010, 03:14 PM
Hi Matt,

I am glad that you were able to fix the problem and shared the solution with the community.

Also, you can find more detailed information regarding such scenarios in this KB article:
RadSplitter which is 100% of the page and has margin applied

Kind regards,
Dobromir
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Splitter
Asked by
Matt
Top achievements
Rank 1
Answers by
Matt
Top achievements
Rank 1
Dobromir
Telerik team
Share this question
or