DocLayouttPanel IE8 Drop Shadows

22 views
Skip to first unread message

Mark Wengranowski

unread,
Jun 29, 2011, 1:56:05 PM6/29/11
to Google Web Toolkit
Hi Everyone,

I have a north, south, east, center layout design and want each area
to have a boxed window with a drop shadow. All seems to work great
with firefox and ie9 using the CSS box-shadow. I want this effect in
ie8 so i add the css property

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4,
Direction=135, Color='#000000')";

It appears in the GWT design window properly but when i view it in the
browser nothing appears. Here is an example of the css code i am using
in the ui xml file:

.toppanel{
background-color: #DD0000;
border-left: 1px solid #777777;
border-right: 1px solid #777777;
border-bottom: 1px solid #777777;
margin-bottom: 4px;
margin-left: 7px;
margin-right: 7px;
-moz-box-shadow: 2px 2px 2px #444;
-webkit-box-shadow: 2px 2px 2px #444;
box-shadow: 2px 2px 2px #444;
-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');
}


The style is applied using the following:

<g:north size='60' >
<h:TopPanel ui:field='topPanel' styleName='{style.toppanel}' />
</g:north>


Any suggestions?

Thanks!

Jeff Larsen

unread,
Jun 29, 2011, 2:05:44 PM6/29/11
to google-we...@googlegroups.com
Check out css3pie http://css3pie.com/

Mark Wengranowski

unread,
Jun 29, 2011, 6:16:39 PM6/29/11
to Google Web Toolkit
That worked! Thanks for the suggestion.

On Jun 29, 11:05 am, Jeff Larsen <larse...@gmail.com> wrote:
> Check out css3piehttp://css3pie.com/

Mark Wengranowski

unread,
Jun 29, 2011, 7:37:43 PM6/29/11
to Google Web Toolkit
It works but when i resize the window a javascript error happens and
the panels will not resize anymore. Any other suggestions?



On Jun 29, 3:16 pm, Mark Wengranowski <m...@greatlittlebox.com> wrote:
> That worked! Thanks for the suggestion.
>
> On Jun 29, 11:05 am, Jeff Larsen <larse...@gmail.com> wrote:
>
>
>
> > Check out css3piehttp://css3pie.com/- Hide quoted text -
>
> - Show quoted text -
Reply all
Reply to author
Forward
0 new messages