Twitter bootstrap - getting an icon next to a list item

Question

I need help using bootstrap twitters. ( http://twitter.imtqy.com/bootstrap/index.html )

I am using a list

<li> 

With the icon that I want to display next to the text of the list items, the problem is that it continues to go below the text, as if it were not in the list item?

 <ul class="dropdown-menu"> <li><a href="/admin.php">Admin CP</a> <span class="badge badge-important">1</span></li> 

Here is the image showing the cpp link using the icon below: http://img195.imageshack.us/img195/3645/screenshotfrom201305201.png

Answer 1

Include the span inside the anchor tag as follows:

 <li><a href="/admin.php">Admin CP <span class="badge badge-important">1</span> </a></li> 

And double check that the span tag did not declare display:block and display:block-inline somewhere. This may be the reason.

UPDATE

In addition, this may cause the icon to float intentionally as follows:

 <span class="badge badge-important pull-right">1</span> 

Hope this helps!