View Full Version : Using float...
worthers20
12-17-2004, 12:15 AM
I'm relatively new to CSS and am trying to learn it. I was just wondering what the advantages of using floats are and what they actually do? Thanks guys(and girls!) :)
IKLOP
12-17-2004, 12:39 AM
<div>'s are mostly what is used in css layouts, and they are block level elements so they start on a new line. By using float you can have multiple divs on one line. For example:<div>Text1</div>
<div>Text2</div>That will display Text1 ontop of Text2. <div style='float:right;'>Text1</div>
<div>Text2</div>That will display Text2 with Text1 all they way to the right of Text2 on the same line. It's not the only reason for float, but it the major idea of using it. It can also be used to have text wrap around other stuff.
RysChwith
12-17-2004, 07:10 AM
What float actually does is position the element in question vertically where it would normally fall, then pushing it as far to the designated side as it can. The element is also considered to take up no height, so that the next element is vertically positioned at the same place. It is more or less the replacement for the align attribute, although it's a little more clearly defined, I think.
Do note that IE has a couple odd little quirks associated with it, but nothing that can't be handled.
Nice tutorial of uses for float (http://css.maxdesign.com.au/floatutorial/)
Big John and Holly (http://www.positioniseverything.net/) have a number of articles explaining the IE oddities.
Rys
worthers20
12-17-2004, 10:11 PM
Thanks guys :) Would using float to position 2 divs on top of each other preferred over using the positioning commands like top: XX relative/absolute?
RysChwith
12-20-2004, 07:34 AM
Do you mean in a sidebar or some such? Because just putting two divs on top of each other, in and of itself, requires nothing special. They do that naturally. As far as things like sidebars, I generally prefer floating, although others might disagree. It tends to be a bit easier to set up, in my experience.
Rys
vBulletin® v3.6.7, Copyright ©2000-2010, Jelsoft Enterprises Ltd.