I have a basic tabpanel containing one FormPanel ( which has a field set) and two regular panels containing full screen lists. After the data is loaded I would like to place a badge over the buttons for the two list panels denoting the number of items retrieved for each (I was just adding a - # to each with the record count, but thought that a badge might look better).

What happens is the badge is actually placed at the edge of the tab bar instead of over each button, and the second overwrites the first. According to the object inspector the badgeText property for each item has the correct value, so I think I am setting the badge text correctly. What I am wondering is if I am missing some class for the badge or some other CSS type element. I saw that there is a default badge css class so I thought I was safe, but obviously somethings unhappy.

Anyone have an idea as to what I am doing incorrectly?