Float adds unnecessary space

Question

I'm trying to design a mouseover description:
Sometimes including one or two extra "infos"
- and for once floats seem to be in order, but:

Why is "15 min." pushed out beyond then end of "maskine" ?
- Can I compact it somehow, to get a straight right margin ?

Solution: Each line of white text must be in it's own span (to not form a single square box):

Answer 1

It does not add "unnecessary" space - it just doesn't know that there is space available in the bounding box of the text (Plysning ...).

One possibility would be to position the 15min text absolute with a top: 0px; right: 0px; and use text-align: right;. Remember to then use position: relative; on the purple wrapping container.