1. #1
    Ext User
    Join Date
    Feb 2009
    Posts
    47
    Vote Rating
    0
    alex1001 is on a distinguished road

      0  

    Default css behavior in panels

    css behavior in panels


    Hi,

    I have the following viewport (only partial code shown) which includes a panel called topPanel:


    Code:
     
    ...
    items: [{
        title: 'Some title here',
        region: 'center'
    },
    {
        title: 'some title,
        region: 'north',
        margins: '0 0 5 0',
        height: 100,
        items: [topPanel]
    },
    ....
    and here is the code for topPanel

    Code:
     
    var topPanel = new Ext.Panel({
        frame: true,
        height: 75,
        id: 'topPanel',
        autoLoad: '/app/amtest.html',
        autoScroll: true
    })

    The topPanel autoLoads amtest.html.

    Here is the code for amtest.html :

    Code:
     
    <style type = "text/css">
    #content3 {
        background: red;
    }
    </style>
     
    <div id="content3">
    <p>Content from external file</p>
    </div>
    As you can see it includes a simple CSS rule, but when the viewport is rendered, the CSS rule is not applied, it just shows the text 'Content from external file' without a red background.

    Any ideas ?

    Thanks,

    Alex.

  2. #2
    Ext User
    Join Date
    Feb 2009
    Posts
    47
    Vote Rating
    0
    alex1001 is on a distinguished road

      0  

    Default


    following on from above thread, the CSS rule is being applied in Firefox, yet in IE7 it is not.

    Any ideas ?????

    Alex.

  3. #3
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    4
    tryanDLS is on a distinguished road

      0  

    Default


    The background property is not (supposed to be) inherited, so the fact that the <p> is red in FF may be a bug.

    Did you try
    Code:
    #content p {background:red}

Thread Participants: 1