Two spans in a div next to each other without floating

Question

I've got two spans in a div. I want to align them next to each other. I'm doing this by floating them both left and right. The problem is that these spans have variable heights (they slide down when you click for 'more options'). So when their heights are changed during runtime (by sliding down), they won't push down the elements under them. If there's a way to align them without floating them, that would work.

Answer 1

Maybe an element with "clear:both" after those spans will solve your problem?

Answer 2

At the risk of getting massive downvotes, use a <table>?

Answer 3

Put overflow:auto or overflow:hidden on your div. This will force the div to size to the floating contents inside.