Can'；t将绝对css定位应用于我自己的复合按钮

这是我遇到的一个奇怪的问题，尽管我有工作要做，但我仍然想理解为什么会发生这种情况

这是我的综合课

    import com.google.gwt.event.dom.client.ClickEvent;
    import com.google.gwt.event.dom.client.ClickHandler;
    import com.google.gwt.event.dom.client.HasClickHandlers;
    import com.google.gwt.event.shared.HandlerRegistration;
    import com.google.gwt.user.client.ui.*;

    public class ExpandingOvalButton extends Composite implements HasClickHandlers
    {   
        private PushButton button;
        private Label label = new Label();
        private AbsolutePanel panel = new AbsolutePanel();

        public ExpandingOvalButton(String text)
        {       
            int width = 40;
            initWidget( panel );
            Image image = new Image( "icons/ovalBlueButton.png");
            label.setText(text);
            width = width + (text.length() * 8);
            String widthStr = width + "px";
            image.setWidth(widthStr);
            image.setHeight("50px");
            button = new PushButton( image );
            button.setWidth(widthStr);
            button.setHeight("50px");
            panel.setSize(widthStr, "50px");                
            panel.add(button, 0, 0);
            panel.add(label, 18, 14);
        }

        ...

当我将它与其他小部件一起添加到flex表中时，它非常适合我，然后我可以将css样式应用到flextable并对其进行精确定位。问题是，如果我想将css定位应用于ExpandingOvalButton实例，而该实例不位于其他面板内，则无法正常工作

private ExpandingOvalButton startBtn = new ExpandingOvalButton("Start");
startBtn .getElement().setId("myId");


#myId
{
    position: absolute;
    left: 30%;
    top: 120px;
}

这不会将其自身定位在距离左侧30%的位置。 但是，如果我将startBtn添加到一个面板，然后将相同的CSS样式应用到面板上，它会将自身定位在左侧30%的位置

panel.add(startBtn);
panel.getElement().setId("myId");

---

以前有人遇到过这种情况，或者知道是什么原因造成的吗

如果您查看AbsolutePanel的源代码，您会在构造函数中发现：

DOM.setStyleAttribute(getElement(), "position", "relative");

这比css中声明的样式具有优先级。您可以通过执行类似的操作来强制它使用绝对定位：

DOM.setStyleAttribute(startBtn.getElement(), "position", "absolute");

---

干杯，它现在起作用了。我不明白的是，为什么当我在CSS中为startBtn元素声明“position:absolute”时，这没有什么区别。参见contentTable.add（startBtn）；startBtn.getElement（）.setId（“myId”）；我的css类=#myId{position:absolute；left:10%；top:130px；}只有在我使用您的DOM.setStyleAttribute行（startBtn.getElement（），“position”，“absolute”）时它才起作用；不知道这是否与您的设置相同，但对于我们的GWT样式，我们通常必须附加！css属性的重要标记，然后它将覆盖GWT设置的内容（通常）。