I want to right-align an inline element to the right of a div
.
I have seen float="right"
applied on a span
to right align its position. But, it seems semantically incorrect to me, as floats are supposed to move "boxes" or block elements left or right of a container element.
Is my understanding of Float wrong or is there another way of right-aligning inline elements in a CSS-container.
Floating an element automatically makes it into a box. (See: http://css.maxdesign.com.au/floatutorial/introduction.htm ) However, there is nothing semantically incorrect about it. Semantics don't dictate what should be displayed as a block and what should be displayed inline--that's one reason we can declare that arbitrarily. (It certainly becomes messy when you start taking words out of their order--but I doubt that's what you're talking about here, as I can't imagine a case when you'd want to do that and have it remain inline.)
Moreover, if you need to align a bit of inline text independent from the flow of normal text (which is what a float does), you really want to display it as a block anyway. If it's really an inline element, all you need is text-align:right
--anything you need a float or a position declared on you are already treating as a block element, so there's nothing wrong with declaring it as such.