Trying to get UIBinder to give me a span not a div

Question

I am building a widget with UiBinder, and I need to have it enclosed in a <span /> but UiBinder only gives me <div />. E.g. <g:HTMLPanel /> => <div />. HorizonPanel, FlowPanel, VerticalPanel also give out only <div />.

Does any one know a solution?

Neckpiece

You read the reasoning for using divs over other tags in HTMLPanel's javadocs for the public HTMLPanel(String tag, String html) ctor: code.google.com/p/google-web-toolkit/source/browse/trunk/user/…. In short: it's to please IE :/ – Hogwash

Answer 1

Try this:

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
         xmlns:g='urn:import:com.google.gwt.user.client.ui'>
    <g:HTMLPanel tag="span">
        <!-- your stuff -->
    </g:HTMLPanel>
</ui:UiBinder>

Brie

Problem is you can't change the content via a ui:field with this technique. – Lexington

Answer 2

You can keep using a <div> but just add display: inline to its CSS, which will make it display as though it were a <span>.

Edit: fixed place at the end where I said 'div' but meant 'span'.

Bead

Answer 3

With regards to the answer above by Robert (sorry I can't figure out how to comment that directly)

This won't work out of the box, as widgets can't be placed inside plain HTML (the compiler will give you "error: found widget in html context"). But there's a simple workaround:

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
             xmlns:g='urn:import:com.google.gwt.user.client.ui'>
  <g:HTMLPanel>
    <span>
      <!-- Your content with widgets goes here -->
    </span>
  </g:HTMLPanel>
</ui:UiBinder>

One other useful thing to mention is InlineHTML and InlineLabel widgets capable of holding arbitary html or plain text respectively in a <span>

Abelabelard

I tried Bob's solution and it worked fine with widgets in the HTMLPanel. – Hairless

my comment applies to an older GWT version - the one that was available in '10 – Abelabelard