I’m just curious what anyone sees here. Do you guys feel like you use floats in ways that they weren’t meant to be used? I guess I probably do. I’m not the HTML/CSS guru that some of you are, so I’m curious what anyone thinks about it. I’m not really sure this is a X vs Y conversation, I’m just curious if this is a pervasive issue - people using the “wrong” thing? Or is it generally just helpful for people to know their options and use the best tool for the job? Every now and then I read an article like this that leaves me interested, but not really sure I’ve found a clear takeaway point.
This is an X vs Y conversation. Floats just have some more issues than other instances. There are some cases where you might want to consider using floats over inline-block (e.g. image floated left and text to the side / wrapping underneith) but generally I don’t even do inline-block much.
I do use inline-block SOME for smaller elements, but not wrapper / columns / bigger elements. I find myself using table/table-cell (display) much more than either methods.
I was a fan of the article until he mentions inline-block to the rescue. If he went table/table-cell route, I’d actually probably visit this website more but he seems to be behind the times.
Inline-block/float/flexbox/table all are tools. It just depends on your requirements as to what you need to use to get the job done. It just so happens that majority of the time, the table/table-cell approach to laying out my webpage is almost always the right choice.
Take this away from the article - there are tools for the job, and it’s your job to find the best tool and use it appropriately. There are places for floats, inline-block, table, etc. It just varies. If I need a two column setup somewhere, will I add in extra HTML to get table/table-cell working? Almost probably no. Inline-block or float? More probable. Depends.
The author does say that it is HIS preferred solution, so it’s purely his opinion, and I can respect that. He mentions that it boils down to the job you need to do and what tool is best.
There are many ways to do something in CSS, but generally only one RIGHT way. If you find yourself doing something that you feel is more difficult / complicated than it should be, chances are your gut feelings are RIGHT!
1 Like
Good thoughts.
So to you, this basically boils down to the tools/job thing - if you’re using a tool incorrectly, or where it doesn’t fit, you’ll experience some problems and those problems should tell you that you need to step back and look at it.
Whereas the author’s opinion is basically a “generally, inline-block can replace the need for floats except in a specific use case”.
That accurate?
Yeah there is no cardinal rule where “floats are bad there is always something better to use”. Rather, there are a lot of cases where floats are bad and there is PROBABLY something better to use. I have no issues or shame in using floats when need be, or it makes sense. To say you’ll never use floats again is just plain silly.
The author is basically saying what I’m saying, except he doesn’t give any alternatives besides inline-block apposed to float. I realize an article can only cover so much but it seems to give hte opinion that inline-block / float is all you have to work with. It leaves out a very important / powerful option.
I wrote three different responses to this and then deleted them and now I’m out of time - I think I have other questions about the way this article is presented (less so about the actual content) and people’s opinions, as I’ve been doing some writing myself. I also have some thoughts about his mention of Flexbox… but yeah out of time, back to work for now, have a call.
1 Like
We had this discussion about 7 years ago where someone else had said the same thing that floats weren’t meant to be used for layout so I posted a link to a w3c page (circa 1999) showing that using floats for layout was indeed one of their uses and showed a three column example. Unfortunately the w3c page has been taken down now but you can see from the following reply by another poster in that thread that the my point was proven beyond doubt.
Floats were always meant to be used for whatever task they were good at doing.
As Ryan mentioned above I also mostly use display table/table-cell now that I don’t support IE7 and under and indeed I mentioned that 7 years ago in the thread I linked to above. Any column structure goes into a table-cell and provides a more robust structure without the risk of float dropping when you don’t want it. It also means you can give your sidebar a small width but just let the other cell fill the remaining space which you can’t do with inline blocks or floats.
Inline-blocks are good for a sequence of variable height elements which you always want to wrap to a new line unlike floats which will snag. The problem with inline-blocks is the white space gap and the hoops you have to jump through to fix them.
As, I always say they are all just tools in the toolbox and you use whatever is appropriate for the job in hand.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.