RSS


FC Member Blog

Floats Collapsing? Fear Not, Developer.

BY Jeffrey OlchovySat Jul 19, 2008 at 4:55 PM
This blog is written by a member of our blogging community and expresses that member's views alone.

If there are any late approaching developers who are just getting their feet wet with proper declarative markup, they may find themselves running back to table based coding quicker than they expected. Most browsers handle CSS quite differently from each, and when working with such temperamental on-page elements like HTML forms, many developers start running for the hills.

Using nested tables for forms, however, is semantically incorrect. According to the W3C, if you are not marking up tabular data, you should not be using table based markup.

Floats are a convenient way around such problems, yet their correct implementation requires knowledge of cross-browser CSS targeting - if you want them to behave the right way.

For example, if you were to float an item in a parent container, you are essentially removing bespoke from the flow of the document. What happens next is that the parent container will collapse, essentially losing its intended layout.

The easiest way to fix this problem is to use an easy-clearing or clear-fix method that will expand the collapsed float.

For my preferred method of fixing such problems (and this works in every browser - even their legacy versions), navigate over to "I Still Ain't Afraid of No Floats: Part II" at my ITKnowledgeExchange Blog entitled "Taming the Wild Wild Web."

Jeffrey Olchovy is a Web developer, designer and marketing strategist.

Topics:

Innovation, Technology, Design, floats, CSS, internet marketing, web design, blogging, web standards, seo, web Development, easy clearing, World Wide Web Consortium, Jeffrey Olchovy


Sign in or register to comment.
or