ButtonGroup Layout

  1. #1

    ButtonGroup Layout

    Hi,
    I am migrating my web app from Ext.NET 1.6 to Ext.NET 3.1 and I dealing this issue:
    I use Ext.Net.ButtonGroup to wrap controls into logic groups. I combine buttons, comboboxes, date pickers...
    With Crisp and Neptune theme of version 3.1 controls in Ext.Net.ButtonGroup look not good because of different heights.

    Gray in 1.6
    Click image for larger version. 

Name:	1.6 gray.png 
Views:	3 
Size:	10.8 KB 
ID:	22701

    Gray in 3.1
    Click image for larger version. 

Name:	3.1 gray.png 
Views:	2 
Size:	8.5 KB 
ID:	22711

    Crisp in 3.1
    Click image for larger version. 

Name:	3.1 crisp.png 
Views:	4 
Size:	11.9 KB 
ID:	22721

    Is there any solution to my problem with asymmetric layout? How can I group controls in toolbar (with title of group)?

    Thanks!
  2. #2
    It's possible to overcome the issue by adding the following css rules
    <!DOCTYPE html>
    <html>
    <head runat="server">
        <style type="text/css">
            /*.x-btn-group-default-framed {
                border: 0px !important;
            }
    
            .x-btn-group-body-default-framed .x-table-layout {
                border-spacing: 0px !important;
            }*/
        </style>
    </head>
    <body>
        <ext:ResourceManager Theme="Crisp" runat="server" />
        <ext:FieldContainer Margin="10" Layout="HBoxLayout" runat="server">
            <Items>
                <ext:DateField runat="server" />
                <ext:ButtonGroup runat="server" Margin="0" Padding="0" Header="false" Border="true" Columns="1">
                    <Items>
                        <ext:Button runat="server" Text="Brazil" Icon="FlagBr" Scale="Small" />
                    </Items>
                </ext:ButtonGroup>
            </Items>
        </ext:FieldContainer>
    </body>
    </html>
    Modified
    Click image for larger version. 

Name:	bg002.png 
Views:	4 
Size:	1.1 KB 
ID:	22831

    Original
    Click image for larger version. 

Name:	bg001.png 
Views:	4 
Size:	1.2 KB 
ID:	22821

Similar Threads

  1. [CLOSED] Emulate ButtonGroup with CommandColumn
    By blueworld in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Oct 09, 2013, 10:51 AM
  2. ButtonGroup Height
    By TonyH in forum 2.x Help
    Replies: 2
    Last Post: Nov 19, 2012, 10:30 PM
  3. [CLOSED] ButtonGroup columns
    By watteeuw in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Sep 24, 2012, 10:51 AM
  4. [CLOSED] [1.0] ButtonGroup tools
    By danielg in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Mar 01, 2010, 12:48 PM
  5. [CLOSED] ButtonGroup Bug
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Dec 13, 2009, 2:42 AM

Posting Permissions