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

RadMenu in a table HTML

4 Answers 159 Views

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

Sabrina asked on 27 Jan 2009, 02:30 PM

Hi !

I try to insert a radmenu in an html table.

i set on the <td> align right, but the radmenu doesn't align at right.

Somebody knows why ?

Thanks,

Sabrina

Example :

    
            <table style="width: 772px" visible="false">                                  
        
                            <tr>                  
        
                                <td align="right">  
        
                                    <telerik:RadMenu ID="RadMenu1" runat="server" EnableEmbeddedSkins="false">  
        
                                        <Items> 
        
                                            <telerik:RadMenuItem Text="CashFlow">  
        
                                                <Items> 
        
                                                    <telerik:RadMenuItem Text="toto" /> 
        
                                                    <telerik:RadMenuItem Text="tata" /> 
        
                                                </Items> 
        
                                            </telerik:RadMenuItem> 
        
                                        </Items> 
        
                                    </telerik:RadMenu> 
        
                                    <asp:Button CssClass="green_button" ID="Btn1" runat="server" Text="Btn 1" UseSubmitBehavior="false" /> 
        
                                    <asp:Button CssClass="green_button" ID="Btn2" runat="server" Text="Btn 2" 
        
                                        UseSubmitBehavior="false"/>                                                  
        
                                </td>                  
        
                            </tr> 
        
                        </table>

4 Answers, 1 is accepted

Accepted

answered on 28 Jan 2009, 11:32 AM

Hi Sabrina,

This is not a simple task as RadMenu renders as block element. Anyway, please find below a sample code snippet that shows the needed approach.

    
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head runat="server"> 
        
                <title>Untitled Page</title> 
        
                <style type="text/css"> 
        
                * html div.RadMenu { display: inline !important } 
        
                *+html div.RadMenu { display: inline !important } 
        
                div.RadMenu 
        
                { 
        
                    float: none !important; 
        
                    display: inline-block !important; 
        
                    vertical-align: middle !important; 
        
                } 
        
                * html div.RadMenu { display: inline !important } 
        
                *+html div.RadMenu { display: inline !important } 
        
                .green_button 
        
                { 
        
                    vertical-align: middle !important; 
        
                } 
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
        
                    </asp:ScriptManager> 
        
                    <table style="width: 772px" visible="false"> 
        
                        <tr> 
        
                            <td align="right"> 
        
                                <telerik:RadMenu ID="RadMenu1" runat="server"> 
        
                                    <Items> 
        
                                        <telerik:RadMenuItem Text="CashFlow"> 
        
                                            <Items> 
        
                                                <telerik:RadMenuItem Text="toto" /> 
        
                                                <telerik:RadMenuItem Text="tata" /> 
        
                                            </Items> 
        
                                        </telerik:RadMenuItem> 
        
                                    </Items> 
        
                                </telerik:RadMenu> 
        
                                <asp:Button CssClass="green_button" ID="Btn1" runat="server" Text="Btn 1" UseSubmitBehavior="false" /> 
        
                                <asp:Button CssClass="green_button" ID="Btn2" runat="server" Text="Btn 2" UseSubmitBehavior="false" /> 
        
                            </td> 
        
                        </tr> 
        
                    </table> 
        
                </form> 
        
            </body> 
        
            </html>

Kind regards,
Paul
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

Accepted

answered on 28 Jan 2009, 02:02 PM

Hello Sabrina,

Just set higher z-index to the RadWindowManager, i.e.

    
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head id="Head1" runat="server"> 
        
                <title>Untitled Page</title> 
        
                <style type="text/css">  
        
                * html div.RadMenu { display: inline !important }  
        
                *+html div.RadMenu { display: inline !important }  
        
                div.RadMenu  
        
                {  
        
                    float: none !important;  
        
                    display: inline-block !important;  
        
                    vertical-align: middle !important;  
        
                }  
        
                * html div.RadMenu { display: inline !important }  
        
                *+html div.RadMenu { display: inline !important }  
        
                .green_button  
        
                {  
        
                    vertical-align: middle !important;  
        
                }  
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
        
                    </asp:ScriptManager> 
        
                    <table style="width: 772px" visible="false"> 
        
                        <tr> 
        
                            <td align="right"> 
        
                                <telerik:RadMenu ID="RadMenu1" runat="server"> 
        
                                    <Items> 
        
                                        <telerik:RadMenuItem Text="CashFlow"> 
        
                                            <Items> 
        
                                                <telerik:RadMenuItem Text="toto" /> 
        
                                                <telerik:RadMenuItem Text="tata" /> 
        
                                            </Items> 
        
                                        </telerik:RadMenuItem> 
        
                                    </Items> 
        
                                </telerik:RadMenu> 
        
                                <asp:Button CssClass="green_button" ID="Btn1" runat="server" Text="Btn 1" UseSubmitBehavior="false" /> 
        
                                <asp:Button CssClass="green_button" ID="Btn2" runat="server" Text="Btn 2" UseSubmitBehavior="false" /> 
        
                            </td> 
        
                        </tr> 
        
                    </table> 
        
                    <telerik:RadWindowManager ID="Singleton" runat="server" Style="z-index: 10000"> 
        
                        <Windows> 
        
                            <telerik:RadWindow OffsetElementID="OffsetElement" Title="Window Titlebar" VisibleTitlebar="true" EnableEmbeddedSkins="false" Top="20" Left="120" VisibleOnPageLoad="true" runat="server" Width="370" Height="250px" NavigateUrl="../../TestPage/Default.html" ID="Radwindow1"> 
        
                            </telerik:RadWindow> 
        
                        </Windows> 
        
                    </telerik:RadWindowManager> 
        
                </form> 
        
            </body> 
        
            </html>

For details on the matter please refer to this help article.

Regards,
Paul
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

RadMenu in a table HTML

4 Answers, 1 is accepted