Toolbar Menu css style properties

  1. #1

    Toolbar Menu css style properties

    Hi,

    do there is a way to easily set by code behind some basic style properties for the Toolbar Menu of the examples

    https://examples1.ext.net/#/Toolbar/Menu/Menu_Layout/

    I mean if there is something like

    this.MyToolBar.FontSize = "my value"
    this.MyToolBar.BackgroundColor = "my value"

    or is it possible to specify a css class?

    Thanks
  2. #2
    Hi,

    I've tried the following code

    <%@ Page Language="C#" AutoEventWireup="true" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <style type="text/css">
            .MyStile
            {            
                background-image: none;
                background-color: #cccccc;
                font-family: Comic Sans MS;
                font-size: 30px;
            }
            
            .MyButton
            {
                background-image: none;
                background-color: #ffff00;
                font-family: Times New Roman;
                font-size: 25px;
            }
            
            .MyItem
            {
                background-image: none;
                background-color: #ff0000;
                font-family: Georgia;
                font-size: 15px;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <ext:ResourceManager ID="ResourceManager1" runat="server" />
    
            <ext:Toolbar runat="server" ID="myToolBar" Cls="MyStile">
                <Items>
                    <ext:Button ID="Button2" runat="server" Text="Products" Cls="MyButton">
                        <Menu>
                            <ext:Menu ID="Menu21" runat="server" ShowSeparator="false">
                                <Items>
                                    <ext:MenuItem runat="server" ID="MenuItem1" Text="Item 1" Cls="MyItem" />
                                    <ext:MenuItem runat="server" ID="MenuItem2" Text="Item 2" />
                                </Items>
                            </ext:Menu>                       
                        </Menu>
                    </ext:Button>
                </Items>
            </ext:Toolbar>
        </div>
        </form>
    </body>
    </html>
    As you can see, I set three css classes, one for tool bar menu, one for button and the latest one for menu item.

    It seems that no all css style properties are correctly loaded by the controls Toolbar menu and Button.

    For example, what is the way to change the font-family of a Button? Also, how is it possible to set the button mouse over background color?

    Thanks

Similar Threads

  1. [CLOSED] Menu style as Microsoft Office 2010
    By supera in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 17, 2012, 2:58 PM
  2. Replies: 0
    Last Post: Sep 27, 2011, 10:24 AM
  3. about toolbar menu
    By Egale in forum 1.x Help
    Replies: 7
    Last Post: Jul 12, 2011, 1:42 PM
  4. Menu + Toolbar
    By Dominik in forum 1.x Help
    Replies: 8
    Last Post: Apr 15, 2010, 4:35 AM
  5. toolbar: drop down menu
    By Kamal in forum 1.x Help
    Replies: 3
    Last Post: Dec 22, 2009, 5:13 AM

Posting Permissions