You found a bug! We've classified it as EXTJS-10084 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Sencha User
    Join Date
    Mar 2013
    Location
    Toronto, Canada
    Posts
    47
    Vote Rating
    2
    Baidaly is on a distinguished road

      0  

    Default Long text in Radio button's boxLabel appears on the next line

    Long text in Radio button's boxLabel appears on the next line


    REQUIRED INFORMATION

    Ext version tested:
    • Ext 4.2.1.883


    Browser versions tested against:
    • Chrome 27.0.1410.64 m
    • FF21.0


    Description:
    • Long text in Radio button's boxLabel appears on the next line.


    Steps to reproduce the problem:
    • Create radio group with radiofields with long text in boxLabel


    The result that was expected:
    • boxLabel text appears on the same line


    The result that occurs instead:
    • boxLabel text appears on the next line


    Test Case:

    Code:
    Ext.onReady(function () {
                Ext.create("Ext.container.Viewport", {
                    "renderTo": Ext.getBody(),
                    "items": [{
                            "xtype": "form",
                            "items": [{
                                    "xtype": "radiogroup",
                                    "items": [{
                                            "xtype": "radiofield",
                                            "name": "Group_1",
                                            "boxLabel": "This is some long text that is very very very very very very very very very very very very very very very very very very very very very very very very very very long"
                                        }, {
                                            "xtype": "radiofield",
                                            "name": "Group_1",
                                            "boxLabel": "This is some long text that is very very very very very very very very very very very very very very very very very very very very very very very very very very long"
                                        }, {
                                            "xtype": "radiofield",
                                            "name": "Group_1",
                                            "boxLabel": "This is some long text that is very very very very very very very very very very very very very very very very very very very very very very very very very very long"
                                        }
                                    ],
                                    "columns": 3
                                }
                            ]
                        }
                    ],
                    "layout": {
                        "type": "fit"
                    }
                });
            });

    HELPFUL INFORMATION

    Screenshot:
    1.jpg

    Possible fix:
    Adding the following CSS solves the problem:

    Code:
    .x-form-cb-label-after {
        display: inline !important;
    }
    Additional CSS used:
    • only default ext-all.css


    Operating System:
    • Win7 Pro
    Ext.NET - ASP.NET for Ext JS
    MVC and WebForms
    Examples | Twitter

  2. #2
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    4,893
    Vote Rating
    175
    slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold

      0  

    Default


    Thanks for the report! I have opened a bug in our bug tracker.

Thread Participants: 1

Tags for this Thread