0

I use GWTbootstrap3 in my project. I want to show a bootstrap badge next to my headline:

Version 1 (works, but shows badget under the headline, which i don't want)

<h1 ui:field="title" class="{style.title} title-width">
</h1>
<b:Badge ui:field="date"/>

Version 2 (does not work, i.e. the headline shows but the span for the badge is NOT there !!)

According to https://www.w3schools.com/bootstrap/bootstrap_badges_labels.asp ... where it says "[...]badges can be used inside other elements [...]" )

<h1 ui:field="title" class="{style.title} title-width">
    <b:Badge ui:field="date"/>  
</h1>

Actually when I inspect the html within Chrome the span element is NOT THERE at all???

Any idea?

Best regards Hannes

HHeckner
  • 4,722
  • 4
  • 23
  • 33
  • h1 is a Block element, not Inline. See details here - http://stackoverflow.com/a/4041841/935651 This means that you cannot place another element next to h1 element. – alexp May 03 '17 at 18:01
  • You can try it yourself and put the badge within h1 and it will show up correctly, the problem is that I don't get it done with gwtbootstrap3 – HHeckner May 03 '17 at 18:05
  • Add your full code for Java class and for ui.xml, it will be easier to tell then what's wrong. – alexp May 03 '17 at 18:11

1 Answers1

0

As you can see the h1 has a ui:field. In the Java Code the bound element is overwritten with setInnerText(). Therefore the badge gets completely eliminated. I was quite stupid to overlook this. Sorry for the question

HHeckner
  • 4,722
  • 4
  • 23
  • 33