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

stretching background color to fill whole of RadPanelBarItem

1 Answer 60 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
Kevin
Top achievements
Rank 2
Kevin asked on 18 May 2010, 04:17 PM
Guys,

see attached image to see exactly whats going on, but the problem is i have a grey background in my radpanelbar item.

The code for my RadPanel bar is as follows.. any suggestions would be appreciated.

                            <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Outlook" Width="100%" 
                                Height="100%" ExpandMode="FullExpandedItem" CssClass="TaskViewerText PanelBarTitleText" 
                                BackColor="#EFEBDE"
                                <Items> 
                                    <telerik:RadPanelItem Text="Summary" Font-Bold="true" Height="32px" Expanded="true" 
                                        runat="server"
                                        <Items> 
                                            <telerik:RadPanelItem id="uiSummaryPanel" runat="server" BackColor="#EFEBDE"
                                                <ItemTemplate> 
                                                    <asp:Panel ID="Panel1" runat="server" BackColor="#EFEBDE"
                                                        <div style="margin-left: 3px; margin-right: 3px; width: 400px; height: 100%; background-color: #EFEBDE;"
                                                            <table class="TaskViewerText" style="height: 115px; margin-bottom:15px;"
                                                                <tr> 
                                                                    <td style="width: 130px;"
                                                                        Document Number : 
                                                                    </td> 
                                                                    <td> 
                                                                        <asp:Label ID="uiDocumentNumberLabelText" Text="[insert text here]" runat="server" /> 
                                                                    </td> 
                                                                </tr> 
                                                                <tr> 
                                                                    <td> 
                                                                        Document Title : 
                                                                    </td> 
                                                                    <td> 
                                                                        <asp:Label ID="uiDocumentTitleLabelText" Text="[insert text here]" runat="server" /> 
                                                                    </td> 
                                                                </tr> 
                                                                <tr> 
                                                                    <td> 
                                                                        Owner : 
                                                                    </td> 
                                                                    <td> 
                                                                        <asp:HyperLink ID="uiDocOwnerLabelText" Text="[insert text here]" runat="server" /> 
                                                                    </td> 
                                                                </tr> 
                                                                </tr> 
                                                                <tr> 
                                                                    <td> 
                                                                        Admin Owner : 
                                                                    </td> 
                                                                    <td> 
                                                                        <asp:HyperLink ID="uiDocAdminOwnerLabelText" Text="[insert text here]" runat="server" /> 
                                                                    </td> 
                                                                </tr> 
                                                                <tr> 
                                                                    <td> 
                                                                        Due Date : 
                                                                    </td> 
                                                                    <td> 
                                                                        <asp:Label ID="uiDueDateLabelText" Text="[insert text here]" runat="server" /> 
                                                                    </td> 
                                                                </tr> 
                                                            </table> 
                                                            <div style="margin-left: 10px; margin-bottom: 5px;"
                                                                Administrator Comments : 
                                                                <asp:TextBox ID="uiAdministratorComments" ReadOnly="true" TextMode="multiline" Height="125" 
                                                                    Width="350" runat="server" /> 
                                                            </div> 
                                                            <div style="margin-left: 10px; margin-bottom: 5px;"
                                                                Document History Notes : 
                                                                <asp:TextBox ID="uiAuditTrailNotes" ReadOnly="true" TextMode="multiline" Height="125" 
                                                                    Width="350" runat="server" /> 
                                                            </div> 
                                                            <div style="margin-left: 10px; margin-bottom: 5px;"
                                                                <asp:Label ID="uiApproverText" Text="[insert text here]" runat="server" /> 
                                                                <div style="overflow-x: auto; overflow-y: scroll; height: 125px; width: 350px; 
                                                                    border: solid 1px #7F9DB9; background-color: White;"> 
                                                                    <asp:PlaceHolder ID="uiSummaryHeader" runat="server" /> 
                                                                </div> 
                                                            </div> 
                                                        </div> 
                                                    </asp:Panel> 
                                                </ItemTemplate> 
                                            </telerik:RadPanelItem> 
                                        </Items> 
                                    </telerik:RadPanelItem> 
                                    <telerik:RadPanelItem Text="Comment History" Height="32px" Font-Bold="true" runat="server"
                                        <Items> 
                                            <telerik:RadPanelItem id="uiChatPanel" runat="server" Height="100%" BackColor="#EFEBDE"
                                                <ItemTemplate> 
                                                    <telerik:RadSplitter ID="ChatSplitter" runat="server" Height="98%" Width="398" Orientation="Horizontal" 
                                                        ResizeWithParentPane="false" PanesBorderSize="0" BorderSize="0" OnClientLoaded="scrollPositionBottom" 
                                                        OnClientResized="scrollPositionBottom"
                                                        <telerik:RadPane ID="uiChatPaneRadPane" runat="server" Scrolling="Y" BackColor="#EFEBDE"
                                                            <asp:PlaceHolder ID="uiChatConsole" runat="server" /> 
                                                        </telerik:RadPane> 
                                                        <telerik:RadSplitBar ID="uiTaskViewerSplitBar1" runat="server" CollapseMode="None" 
                                                            EnableResize="false" /> 
                                                        <telerik:RadPane Height="200" MinHeight="200" MaxHeight="200" ID="TopPane" runat="server" 
                                                            Scrolling="none" BackColor="#EFEBDE"
                                                            <div class="TaskViewerText" style="background-color: #EFEBDE;"
                                                                <div style="text-align: left; margin-top: 5px; margin-left: 10px;"
                                                                    Comment : 
                                                                </div> 
                                                                <div style="text-align: left; margin-top: 3px; margin-left: 10px;"
                                                                    <asp:TextBox ID="uiChatComment" runat="server" TextMode="multiline" Style="height: 120px; 
                                                                        width: 375px;">  
                                                                    </asp:TextBox> 
                                                                </div> 
                                                                <div style="text-align: right; margin-top: 10px; margin-right: 10px;"
                                                                    <asp:Button Text="Submit" OnClick="sendMessage_Click" runat="server" Enabled="false" 
                                                                        ID="sendMessage" Style="width: 100px;"></asp:Button> 
                                                                </div> 
                                                            </div> 
                                                        </telerik:RadPane> 
                                                    </telerik:RadSplitter> 
                                                </ItemTemplate> 
                                            </telerik:RadPanelItem> 
                                        </Items> 
                                    </telerik:RadPanelItem> 
                                    <telerik:RadPanelItem Text="Voting Summary" Height="32px" Font-Bold="true" runat="server"
                                        <Items> 
                                            <telerik:RadPanelItem id="uiVotingPanel" runat="server"
                                                <ItemTemplate> 
                                                    <telerik:RadSplitter ID="VotingSplitter" runat="server" Height="100%" Width="398" 
                                                        Orientation="Horizontal" ResizeWithParentPane="false" PanesBorderSize="0" BorderSize="0" 
                                                        OnClientLoaded="SetSplitterHeight" OnClientResized="SetSplitterHeight"
                                                        <telerik:RadPane ID="uiVotingSummaryPanelUsers" runat="server" Scrolling="Y"
                                                            <asp:PlaceHolder ID="uiVotingSummary" runat="server" /> 
                                                        </telerik:RadPane> 
                                                        <telerik:RadSplitBar ID="uiTaskViewerSplitBar2" runat="server" CollapseMode="None" 
                                                            EnableResize="false" /> 
                                                        <telerik:RadPane Height="200" MinHeight="200" MaxHeight="200" ID="TopPane" runat="server" 
                                                            Scrolling="none"
                                                            <div class="TaskViewerText" style="height:200px; background-color: #EFEBDE;"
                                                                <div style="text-align: left; margin-top: 1px; margin-left: 10px;"
                                                                    Vote : 
                                                                </div> 
                                                                <div style="text-align: left; margin-top: 1px; margin-left: 10px;"
                                                                    <asp:TextBox ID="uiComment" runat="server" TextMode="multiline" Style="height: 120px; 
                                                                        width: 375px;">  
                                                                    </asp:TextBox> 
                                                                </div> 
                                                                <table style="width: 100%"
                                                                    <tr style="width: 100%"
                                                                        <td style="width: 50%"
                                                                        </td> 
                                                                        <td style="width: 50%"
                                                                            <div style="text-align: right; margin-top: 10px; margin-bottom: 20px; margin-right: 10px;"
                                                                                <asp:Button Text="Pass" OnClick="sendVotePass_Click" runat="server" ID="uiPassRadioButton" 
                                                                                    Style="width: 75px;"></asp:Button> 
                                                                                <asp:Button Text="Fail" OnClick="sendVoteFail_Click" runat="server" ID="uiFailRadioButton" 
                                                                                    Style="width: 75px;" Enabled="false"></asp:Button> 
                                                                            </div> 
                                                                        </td> 
                                                                    </tr> 
                                                                </table> 
                                                            </div> 
                                                        </telerik:RadPane> 
                                                    </telerik:RadSplitter> 
                                                </ItemTemplate> 
                                            </telerik:RadPanelItem> 
                                        </Items> 
                                    </telerik:RadPanelItem> 
                                </Items> 
                            </telerik:RadPanelBar> 

1 Answer, 1 is accepted

Sort by
0
Nikolay Tsenkov
Telerik team
answered on 19 May 2010, 03:59 PM
Hello kevin,

You can fix this problem by adding a css-class to the RadPanelItem's.
Here is a snippet of how the first item should look like:
<telerik:RadPanelItem Text="Summary" Font-Bold="true" Height="32px" Expanded="true" runat="server" ChildGroupCssClass="applyBackground" BackColor="#EFEBDE">

After that you simply add a style to the page:
.applyBackground
{
    background-color:#EFEBDE !important;
}
This should do.

Hope this solves your problem!


Regards,
Nikolay Tsenkov
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
PanelBar
Asked by
Kevin
Top achievements
Rank 2
Answers by
Nikolay Tsenkov
Telerik team
Share this question
or