CSS DropShadow for DockLayoutPanel?

[membersound]

Hi,
I'm trying to apply a dropshadow around a DockLayoutPanel area. But can't get it to work:

    .shadow {
        -moz-box-shadow: 3px 3px 4px #000;
        -webkit-box-shadow: 3px 3px 4px #000;
        box-shadow: 3px 3px 4px #000;
        /* For IE 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
        /* For IE 5.5 - 7 */
        filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
    }


<g:DockLayoutPanel unit='EM' styleName='{style.shadow}'>
<g:center...>
<g:east...>


Result: NO drop shadow at all. What might be wrong here?

[Ümit Seren]

use Developer Tools to check the CSS and the HTML elements of the rendered page. 
I assume that by default DockLayoutPanel has no margins between the panels and the drop shadows are usually outside of the box and thus not visible.  

[Thomas Broyer]

On Wednesday, January 2, 2013 10:12:10 AM UTC+1, membersound wrote:

Hi,
I'm trying to apply a dropshadow around a DockLayoutPanel area. But can't get it to work:

    .shadow {
        -moz-box-shadow: 3px 3px 4px #000;
        -webkit-box-shadow: 3px 3px 4px #000;
        box-shadow: 3px 3px 4px #000;
        /* For IE 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
        /* For IE 5.5 - 7 */
        filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');

Probably unrelated to your problem but this is not valid CSS so you should use a literal() in your CssResource/<ui:style> (I assume this is the case given that you use styleName="{style.shadow}" below).