question about the float declaration

liunx

Guest
i see many ppl use the float declaration quite a bit it seems. My question is why? what makes float so good? i dont really see the greatness of it i guess. I see more things go wrong w/ it i think is one thing. thx allIt just enabled two two block-level elements to sit next to each other (by default they would be displayed on seperate lines). This is of course common in layouts where you have two or three blocks holding some sort of content; the float property allows them to all sit next to each other creating a simple two or three-column layout. Such usage can cause problems if not implemented correctly, and typically making proper use of margins can provide a more consistent and predictable layout across browsers and platforms.

However, "by the book", it's used for things like where you want text to "wrap" around an image and perhaps other such similar applications. Check out the Floatutorial (<!-- m --><a class="postlink" href="http://css.maxdesign.com.au/floatutorial/tutorial0106.htm">http://css.maxdesign.com.au/floatutoria ... al0106.htm</a><!-- m -->) for such application. The Floatutorial also offers CSS-based layouts utilizing float which look pretty solid, so that may also be worth a look.i guess i understand how it is used or whatever. but it seems to have a lot of things that can go wrong w/ it w/ appearance. For example, in tutorials i have seen it used for making three column non table pages. OK, well sounds good but when u resize the screen it becomes all messed up w/ content overlapping other content. One question though, i have seen the declaration at one point min-width: (i believe that was what it was) but have not seen it used. So could u use that for the example i gave w/ the 3 column by putting all three divs into one div w/ a min-width: declaration? also if so, would this work across the browsers? or is there problems w/ it and if so what? thx for the help :)Hi -
I also use dl's and float them for smaller pic galleries, which works nicely.

Think that resize issues happen when you set widths and heights with specific lengths, rather than relative units; or don't design for 800x600!

Make a container div to house the other three - it can be same h, w as the body, or whatever.
Create the left div first and determine the % of the width it'll take, then the center, then right. If each has a float:left; property, they should behave sort of like inline elements - starting as far to the top & left of the container as possible, and bumping up against one another after that.

[Or please read one of the many fine tutorials out there!]

Depends on your use of padding and margins - and whatever TLC you bother to perform for IE, also.

Floats are cool,
El
 
Back
Top