OK, the solution is basically that you have to add a label (even a
completely empty Label!) or else the horizontal panel is not
displayed, regardless if you set a height or not.

ie.
            HorizontalPanel separaterPanel = new HorizontalPanel();
            separaterPanel.setWidth("90%");
            separaterPanel.add(new Label(""));
            DOM.setStyleAttribute(separaterPanel.getElement(),
"borderBottom", "1px solid #DCDCDC");
            DOM.setStyleAttribute(separaterPanel.getElement(),
"margin", "7px");

Why does adding the label make the horizontal panel be displayed? Or,
why won't the HP be displayed without something inside?

Thanks,

Mark

On Nov 4, 8:24 am, mwaschkowski <[EMAIL PROTECTED]> wrote:
> OK, I'll give it a try. I'm actually trying NOT to use a label, and
> just make the horizontal panel 90% width and show a bottom border.
> (ie. its 90% wide and contains nothing, but does show the bottom
> border)
>
> ex.
>         HorizontalPanel p = new HorizontalPanel();
>         p.setWidth("100%");
>         DOM.setStyleAttribute(p.getElement(), "borderBottom", "1px
> solid black");
>         RootPanel.get().add(p);
>
> It may the height is causing a problem, I'll try changing that and see
> what happens...
>
> Thanks again for your help!
>
> Mark
>
> On Nov 4, 8:18 am, "Ian Bambury" <[EMAIL PROTECTED]> wrote:
>
> > No. It is not a bug. It works fine.
> > If you are having a problem with something, don't check it inside another
> > program, use a blank project and try it there.
>
> > Obviously your app is doing something to it. For example, putting a lable in
> > it and then making it 1px high will mean that only the top px will be shown
> > and that isn't going to be the border at the bottom.
>
> > Get a clean test app (not the one created by the application creator which
> > has, for example, standard styles) and keep it around just for testing
> > stuff.
>
> > Then try this:
>
> >         HorizontalPanel p = new HorizontalPanel();
> >         p.add(new Label("Hello"));
> >         DOM.setStyleAttribute(p.getElement(), "borderBottom", "1px solid
> > black");
> >         RootPanel.get().add(p);
>
> > The border will be there
>
> > Ian
>
> >http://examples.roughian.com
>
> > 2008/11/4mwaschkowski<[EMAIL PROTECTED]>
>
> > > Hi Ian!
>
> > > I appreciate the suggestion, but I had actually tried that previously
> > > as well. I tried it again to make sure:
>
> > >            HorizontalPanel separaterPanel = new HorizontalPanel();
> > >            separaterPanel.setWidth("90%");
> > >            separaterPanel.setHeight("1px");
> > >             DOM.setStyleAttribute(separaterPanel.getElement(),
> > > "borderBottom", "1px solid black");
> > >             //DOM.setStyleAttribute(separaterPanel.getElement(),
> > > "border", "1px solid black");
> > >            vp.add(separaterPanel);
> > >            vp.setCellWidth(separaterPanel, "100%");
> > >            vp.setCellHorizontalAlignment(separaterPanel,
> > > HasHorizontalAlignment.ALIGN_CENTER);
>
> > > Unfortunately that doesn't show either :( Is this a bug then?
>
> > > Cheers,
>
> > > Mark
>
> > > On Nov 1, 4:31 pm, "Ian Bambury" <[EMAIL PROTECTED]> wrote:
> > > > GWT gets translated into JavaScript.
> > > > JavaScript uses camelCase
>
> > > > Therefore you need borderBottom not border-bottom
>
> > > > Ian
>
> > > >http://examples.roughian.com
>
> > > > 2008/11/1mwaschkowski<[EMAIL PROTECTED]>
>
> > > > > I'm having a couple of problems with css, any suggestions appreciated.
>
> > > > > I'm trying to create a bottom border, similar to an <hr> html element.
>
> > > > > I've tried the following:
>
> > > > >                HorizontalPanel separaterPanel = new
> > > > > HorizontalPanel();
> > > > >                separaterPanel.setWidth("90%");
> > > > >                separaterPanel.setHeight("1px");
> > > > >                separaterPanel.add(new Label("--"));
> > > > >                //DOM.setStyleAttribute(separaterPanel.getElement(),
> > > > > "border-bottom", "1px solid black");
> > > > >                DOM.setStyleAttribute(separaterPanel.getElement(),
> > > > > "border", "1px solid black");
> > > > >                vp.add(separaterPanel);
> > > > >                vp.setCellWidth(separaterPanel, "100%");
> > > > >                vp.setCellHorizontalAlignment(separaterPanel,
> > > > > HasHorizontalAlignment.ALIGN_CENTER);
>
> > > > > which works fine, but only with a Label present (which I don't
> > > > > actually want). The I comment out the the 'border' tag and instead try
> > > > > to use 'border-bottom', as shown below, nothing displays:
>
> > > > >                DOM.setStyleAttribute(separaterPanel.getElement(),
> > > > > "border-bottom", "1px solid black");
> > > > >                //DOM.setStyleAttribute(separaterPanel.getElement(),
> > > > > "border", "1px solid black");
>
> > > > > and if I remove the label, neither css shows a border. Can someone set
> > > > > me on the right css path?
>
> > > > > Thanks!
>
> > > > > Mark
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Google Web Toolkit" group.
To post to this group, send email to Google-Web-Toolkit@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/Google-Web-Toolkit?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to