如何使Bootstrap下拉菜单的内容全宽？

Question

I have a dropdown-menu in bootstrap with content as pull-right like this:

<ul class="dropdown-menu pull-right" role="menu">
<li><a href="">Link <span class="pull-right">123</span></li>
</ul>

How do I make it so that both the Link and the 123 are on the same line, no matter how wide it pulls the dropdown-menu ?

Right now, it seems to push the 123 down to the next line if it becomes too wide.

I found a fix by adding min-width: 200px; for example, but it's not a nice solution because the menu might or might not contain a number count at all, so it leaves a blank space.

Update: It seems that only in Firefox it's jumping to the next line, while Chrome shows it correctly.

Answer 1

This answered my problem:

https://github.com/twbs/bootstrap/issues/13876

It seems that the span pull-right must come BEFORE the text.