Manipulate DOM, strange behaviour in IE8

[bebo]

I know this is not exactly good practice, but I need to create dinamically a gradient effect, and I can't think to other solutions.

This code works fine for Firefox, Safari, and Chrome:

        ColorPickerItem colorPickerTop = new ColorPickerItem("Top");
	ColorPickerItem colorPickerBottom = new ColorPickerItem("Bottom");
	Label lbl = new Label("Hello World");
	
	private static final String GRADIENT =
			"filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$COLOR1', endColorstr='$COLOR2'); "+
			"background: -ms-linear-gradient(top, $COLOR1,$COLOR2 100%); " +
			"background: -webkit-gradient(linear, left top, left bottom, from($COLOR1), to($COLOR2));  "+
			"background: -moz-linear-gradient(top,  $COLOR1,  $COLOR2); ";
	
    public void onModuleLoad() {  
    	if (!GWT.isScript()) { 
    	    KeyIdentifier debugKey = new KeyIdentifier(); 
    	    debugKey.setCtrlKey(true); 
    	    debugKey.setKeyName("E"); 
    	    Page.registerKey(debugKey, new KeyCallback() { 
    	        public void execute(String keyName) { 
    	            SC.showConsole(); 
    	        }
    	    });
    	}
	    
    	colorPickerTop.addChangedHandler(this);
    	colorPickerBottom.addChangedHandler(this);
    	colorPickerTop.setValue("#FFFFFF");
    	colorPickerBottom.setValue("#000000");
    	DynamicForm form = new DynamicForm();
    	form.setItems(colorPickerTop, colorPickerBottom);
    	
    	lbl.setSize("400px", "300px");
    	lbl.setBorder("1px solid black");
    	
    	VLayout vl = new VLayout();
    	vl.addMember(form);
    	vl.addMember(lbl);
    	vl.addMember(lblLog);
    	RootPanel.get().add(vl);
    }

    @Override
    public void onChanged(ChangedEvent event) {
   	String colorTop = colorPickerTop.getValueAsString();
	String colorBottom = colorPickerBottom.getValueAsString();
	String gradient = GRADIENT.replaceAll("\\$COLOR1", colorTop).replaceAll("\\$COLOR2", colorBottom);
	lbl.getDOM().setAttribute("style", gradient);
    }

After onChanged triggered, I was expecting to find in the style attribute the exact gradient String I created, but evidently SmartGWT js changes it, for example in Chrome I got:

style="background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(0, 0, 255)), to(rgb(102, 102, 153))); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; background-position: initial initial; background-repeat: initial initial; "

But in IE8 there's no track of the gradient:

style="z-index: 200054; position: absolute; width: 400px; height: 300px; overflow: visible; top: 52px; cursor: default; left: 0px"

This happens both with 3.0 or 2.5 (actually with 2.5 in IE8 generates two same style attributes).
Any idea how to workaround this, or another way to achieve the same result?

[bebo]

Well, I found out in IE8 you can't use setAttribute("style", style). That is the problem.