1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    7
    Vote Rating
    0
    amajedi is on a distinguished road

      0  

    Default Answered: Adding buttons to a Panel

    Answered: Adding buttons to a Panel


    Whenever I add a button to an Ext.Panel, the button isn't rendered correctly.

    With button directly added to panel it looks like this:
    http://i.imgur.com/Fq9wA.png

    My temporary solution was to add the buttons to a panel's toolbar:
    http://i.imgur.com/UUlcr.png

    Does anyone know why the buttons are being drawn that way?

  2. I don't run into that problem when i try something like:

    Code:
    new Ext.Panel({
        renderTo : Ext.getBody(),
        height : 200,
        width : 200,
        title : 'Panel',
        items : {
            xtype : 'button',
            iconCls : 'icon-add'
        }
    });
    Do you have any special CSS?

  3. #2
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,361
    Answers
    102
    Vote Rating
    81
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    I don't run into that problem when i try something like:

    Code:
    new Ext.Panel({
        renderTo : Ext.getBody(),
        height : 200,
        width : 200,
        title : 'Panel',
        items : {
            xtype : 'button',
            iconCls : 'icon-add'
        }
    });
    Do you have any special CSS?

  4. #3
    Sencha User
    Join Date
    Aug 2011
    Posts
    7
    Vote Rating
    0
    amajedi is on a distinguished road

      0  

    Default


    You're right it was my reset css

    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    }

    Culprit was the vertical-align: baseline;

  5. #4
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,361
    Answers
    102
    Vote Rating
    81
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    Please mark this question as answered.

Thread Participants: 1