Results 1 to 6 of 6

Thread: Selectfield label and description are displayed below each other

Threaded View

Previous Post Previous Post   Next Post Next Post
    Success! Looks like we've fixed this one. According to our records the fix was applied for TOUCH-4443 in a recent build.
  1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    6
    Vote Rating
    2
      1  

    Default Selectfield label and description are displayed below each other

    REQUIRED INFORMATION


    Ext version tested:

    • Sencha Touch 2.2



    Browser versions tested against:

    • Google Chrome 26.0.1410.64



    DOCTYPE tested against:


    Description:

    • When using hbox/vbox layout in a fieldset the label and the value of a selectfield are displayed in to different lines.



    Steps to reproduce the problem:

    • Add a layout to a fieldset containing selectfields



    The result that was expected:

    • Label and value should appear in one line. (screenshot2.jpg)



    The result that occurs instead:

    • Label and value are displayed below each other. (screenshot1.jpg)



    Test Case:

    Code:
    Ext.define('test.view.Main', {
        extend: 'Ext.tab.Panel',
        xtype: 'main',
        requires: [
            'Ext.TitleBar',
            'Ext.Video'
        ],
        config: {
            tabBarPosition: 'bottom',
    
            items: [
                {
                    title: 'Welcome',
                    iconCls: 'home',
    
                    styleHtmlContent: true,
                    scrollable: true,
    
                    items: [{
                        docked: 'top',
                        xtype: 'titlebar',
                        title: 'Welcome to Sencha Touch 2'
                    },{
                        xtype: 'fieldset',
                        layout: {
                            type: 'hbox',
                            align: 'middle'
                        },
                        title: 'About You',
                        instructions: 'Tell us all about yourself',
                        items: [{
                            xtype: 'selectfield',
                            label: 'Choose one',
                            options: [
                                {text: 'First Option',  value: 'first'},
                                {text: 'Second Option', value: 'second'},
                                {text: 'Third Option',  value: 'third'}
                            ]
                        },{
                            xtype: 'selectfield',
                            label: 'Choose one',
                            options: [
                                {text: 'First Option',  value: 'first'},
                                {text: 'Second Option', value: 'second'},
                                {text: 'Third Option',  value: 'third'}
                            ]
                        }]
                    }]
                },{
                    title: 'Get Started',
                    iconCls: 'action',
    
                    items: [
                        {
                            docked: 'top',
                            xtype: 'titlebar',
                            title: 'Getting Started'
                        },
                        {
                            xtype: 'video',
                            url: 'http://av.vimeo.com/64284/137/87347327.mp4?token=1330978144_f9b698fea38cd408d52a2393240c896c',
                            posterUrl: 'http://b.vimeocdn.com/ts/261/062/261062119_640.jpg'
                        }
                    ]
                }
            ]
        }
    });


    HELPFUL INFORMATION


    Screenshot or Video:

    • screenshot1.jpg



    See this URL for live test case: http://


    Debugging already done:

    • yes



    Possible fix:

    • the css class ".x-stretched.x-container" contains "-webkit-box-orient: vertical;". If you change that to "-webkit-box-orient: horizontal;" the bug is resolved



    Additional CSS used:


    Operating System:

    • Win7
    Attached Images Attached Images

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •