Firefox float bug? How do I get my float:right on the same line?

Question

I have the following fiddle:

http://jsfiddle.net/q05n5v4c/2/

In Chrome, it renders just fine. The chevron is on the right side.

However, in Firefox, it

Answer 1

Remove the float on the span, add position: absolute to it and position it using top/right/bottom/left.
Note: .btn-group already have position: relative from bootstrap.

HTML

          
    
    Checked option
  

CSS

div.btn-group span {
  position: absolute;
  top: 7px;
  right: 12px;
}

Here's a working fiddle.