View Full Version : Floating an inline element

08-13-2011, 09:50 PM
OK, I know when you float a block element, that it is taken out of the flow of the page and everything flows around it.

Does the same happen with an inline element, however it is only taken out of the flow of the block element and all the other inline elements flow around it?

E.g. Say I have a paragraph with multiple images, text, q tags etc etc.

Lets say I want to float some of the text with a <span> tag or the <q> tag, I assume this would come up to float either top right or top left, and everything else would look to float around it? E.g. Text would re-size automatically? Or as the elements are inline would they lap over each other not paying attention to each other and I would need to play around with margins etc?

I know with floating block elements there are no problems as the inline elements inside the other block elements you have floated next to, respect the other block elements..

08-13-2011, 10:07 PM
once you float something, it is not really block or inline. It's a separate class on its own. At least that's what I think, you should try testing it in a new text document, when you do these little testings you gain a lot of understanding. make sure you look at them with inspect element to gain a better picture

08-14-2011, 04:18 PM
<span>, <q>, <a>, ... all are inline elements by default.. so no need to define float property for them.....

Float property is required for block-level elements,

Float will work only it size of that block-level element is smaller than its parent element.

08-14-2011, 06:57 PM
<span> still allows for white-space, therefore yes, you do float them