Re: How to center a VerticalPanel on page with UiBinder

have you tried...

<g:HorizontalPanel width="100%">
<g:Cell horizontalAlignment="ALIGN_CENTER">
<g:VerticalPanel ui:field="verticalPanel">
...
</g:VerticalPanel>
</g:Cell>
</g:HorizontalPanel>

On May 28, 8:38 am, BryanPoit <bryanp...@gmail.com> wrote:
> <ui:style>
>         .centerStyle {
>         width: 800px;
>         margin: 0 auto 0 auto;
>         }
> </ui:style>
>
> Is where the definition for style.centerStyle comes from.
>
> Uibinder interprets the style elements and they can be accessed
> using style.stylename.
>
> On May 28, 9:19 am, Mike <m...@sheridan-net.us> wrote:
>
>
>
> > Where did it get the definition for: {style.centerStyle} ???
>
> > Does UiBinder have access to all of the "default" style information
> > provided by GWT?
>
> > Usually, to center something horizontally, the technique is this:
>
> > .centerStyle {
> >    margin-left: auto;
> >    margin-right: auto;
>
> > }
>
> > (I believe)
>
> > Cheers
> > Mike
>
> > On May 28, 7:07 am, Mark <rausch.pi...@gmail.com> wrote:
>
> > > I finally found out how to do this:
> > > <g:VerticalPanel ui:field="vertialPanel"
> > > styleName='{style.centerStyle}'>
>
> > > Hopefully this will help anybody else.
>
> > > On 27 Mai, 13:27, Mark <rausch.pi...@gmail.com> wrote:
>
> > > > Hello,
>
> > > > I am new to gwt and I hope you can help me. I want to center a
> > > > VerticalPanel on the page.
>
> > > > <g:VerticalPanel ui:field="vertialPanel"> <!-- this panel should be in
> > > > the middle of the page -->
> > > >         <g:Label >Login Settings</g:Label>
> > > >         <g:Label>title</g:Label>
> > > >         <g:Label>placeholder</g:Label>
> > > >         <g:TextArea>text1</g:TextArea>
> > > >         <g:TextArea>text2</g:TextArea>
> > > >         <g:Label>stats</g:Label>
> > > > </g:VerticalPanel>
>
> > > > I tried several things like:
>
> > > > <ui:style>
> > > >         .centerStyle {
> > > >         width: 800px;
> > > >         margin: 0 auto 0 auto;
> > > >         }
> > > > </ui:style>
> > > > <g:VerticalPanel ui:field="vertialPanel" class='{style.centerStyle}'>
>
> > > > or
>
> > > > @UiField
> > > > VerticalPanel vertialPanel;
>
> > > > public void onModuleLoad() {
>
> > > > vertialPanel.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
> > > >         vertialPanel.setWidth("100%");
> > > >         RootLayoutPanel.get().add(uiBinder.createAndBindUi(this));
>
> > > > }
>
> > > > My solutions all ended up with a page showing nothing...
> > > > Can you perhaps give me a hint where to read more about this hole Ui
> > > > Binder stuff? I think the google page is not very detailed...
>
> > > > Thank you very much.
>
> > > > 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 google-web-toolkit+unsubscribe@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.