What's New?

Button Width

  1. #1
    Apr 04, 2008, 1:48 PM

    Button Width

    I'm having difficulties to change default button width. Using "Width" or "CssClass" properties seems not to be working.

    Code:

        <cool:Button ID="Button1" runat="server" Text="Submit" Type="Submit" CssClass="ext-btn">
    </cool:Button>

    <cool:Button ID="Button2" runat="server" Text="Submit" Type="Submit" Width="280">
    </cool:Button>
    CSS class:

        .ext-btn

    {

        width:280px;

    }
    Also tried "Cls" property, same result.
  2. #2
    Apr 04, 2008, 5:04 PM

    RE: Button Width

    Hi Vlad,

    The original (ExtJs) don't have width config property but you can use next work-around:

    <head runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
        #<%#Button1.ClientID%>
        {
         width:100px !important;
        }
        
        #<%#Button2.ClientID%>
        {
         width:200px !important;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" />
        
        <ext:Button runat="server" ID="Button1" Text="1"></ext:Button>
        <ext:Button runat="server" ID="Button2" Text="2"></ext:Button>
    </form>
</body>
    and don't forget to call Page.Header.DataBind() in this example
  3. #3
    Apr 05, 2008, 3:51 AM

    RE: Button Width

    Hi vladimir

    Thank you for your reply. I just figure out another simple workaround posted below.

     
<cool:Button ID="Button1" runat="server" Text="<div style='width:100px'>Submit
" Type="Submit">
</cool:Button>

    BTW forum admins - I couldn't post this reply in Firefox browser. No editor field.



  4. #4
    Jun 09, 2008, 7:42 PM

    RE: Button Width

    The following forum post link to a sample which demonstrates how to align the text and icon to the right.

    See, http://forums.ext.net/showthread.php?postid=540.aspx
    Geoffrey McGill
    Founder
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter

Similar Threads

  1. [CLOSED] button width IE7
    By nhg_itd in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Nov 24, 2011, 6:51 AM
  2. Button width
    By dan182 in forum 1.x Help
    Replies: 9
    Last Post: Feb 11, 2011, 9:56 AM
  3. [CLOSED] Button width issue
    By speedstepmem3 in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Jun 18, 2010, 4:40 PM
  4. Button Width - help!!!
    By Tbaseflug in forum 1.x Help
    Replies: 5
    Last Post: May 05, 2010, 2:52 PM
  5. How to set the button's width?
    By jachnicky in forum 1.x Help
    Replies: 1
    Last Post: Dec 11, 2008, 6:53 AM

Posting Permissions