5 ms·

Floats are still useful, not for the same things you would use grid/flex but still has utility, so its good to know about them.

kerkeslager 7y ago
For what? I literally haven't used float since grid/flexbox hit adequate market share on CanIUse, and I've been doing web development full time this whole time.
- srirachafari 7y ago
  For when you move to a company where the current canIUse marketshare for grid/flexbox is no longer "adequate."
- throwaway_bad 7y ago
  Floats should now only be used for what it's named for, to float around other elements: https://developer.mozilla.org/en-US/docs/Web/CSS/shape-outside https://developer.mozilla.org/en-US/docs/Web/CSS/shape-outsi... (shape-outside is super buggy though)
- nwienert 7y ago
  For having an image where text flows around it once it finishes. It’s basically good for some text flowing stuff. Which makes sense, that’s what it was designed for originally.
- tannhaeuser 7y ago
  Floats are still useful when you want to express structured document flow layouts with illustrations for nearby body text, side-nav link boxes, aligned or otherwise flow-parametered effects such as initials, syndicated/contributed content, or when you just want to float text around images.
  - fjp 7y ago
    Every time I thought I have needed float, I have always later found a cleaner way to do it without float.
    - shawnz 7y ago
      That's probably because float is almost always used for things which it's not designed for. For cases like what the parent described, which float is actually meant for, there is no alternative. A good example is the floating picture boxes next to paragraphs on Wikipedia. How would you implement such a feature without floats?
- chrismorgan 7y ago
  On my website I have a sidebar (on large enough displays) where I put sidenotes (which I typically prefer to footnotes). https://chrismorgan.info/blog/dark-theme-implementation/ https://chrismorgan.info/blog/dark-theme-implementation/ is an example of an article with both float-based sidenotes and grid-based figure captions in that sidebar. Look at what happens on mobile-sized displays, too. https://chrismorgan.info/blog/2019-website/ https://chrismorgan.info/blog/2019-website/ is an example of where float really shines on this, with the second sidenote automatically moving down the page due to the length of the first sidenote.

kerkeslager 7y ago

For what? I literally haven't used float since grid/flexbox hit adequate market share on CanIUse, and I've been doing web development full time this whole time.

srirachafari 7y ago
For when you move to a company where the current canIUse marketshare for grid/flexbox is no longer "adequate."
throwaway_bad 7y ago
Floats should now only be used for what it's named for, to float around other elements: https://developer.mozilla.org/en-US/docs/Web/CSS/shape-outside https://developer.mozilla.org/en-US/docs/Web/CSS/shape-outsi... (shape-outside is super buggy though)
nwienert 7y ago
For having an image where text flows around it once it finishes. It’s basically good for some text flowing stuff. Which makes sense, that’s what it was designed for originally.
tannhaeuser 7y ago
Floats are still useful when you want to express structured document flow layouts with illustrations for nearby body text, side-nav link boxes, aligned or otherwise flow-parametered effects such as initials, syndicated/contributed content, or when you just want to float text around images.
- fjp 7y ago
  Every time I thought I have needed float, I have always later found a cleaner way to do it without float.
  - shawnz 7y ago
    That's probably because float is almost always used for things which it's not designed for. For cases like what the parent described, which float is actually meant for, there is no alternative. A good example is the floating picture boxes next to paragraphs on Wikipedia. How would you implement such a feature without floats?
chrismorgan 7y ago
On my website I have a sidebar (on large enough displays) where I put sidenotes (which I typically prefer to footnotes). https://chrismorgan.info/blog/dark-theme-implementation/ https://chrismorgan.info/blog/dark-theme-implementation/ is an example of an article with both float-based sidenotes and grid-based figure captions in that sidebar. Look at what happens on mobile-sized displays, too. https://chrismorgan.info/blog/2019-website/ https://chrismorgan.info/blog/2019-website/ is an example of where float really shines on this, with the second sidenote automatically moving down the page due to the length of the first sidenote.