#140: Exploring CSS Layout Techniques While Trying To Get a Subtitle to Wrap

Avatar of Chris Coyier
Chris Coyier on

Find and fix web accessibility issues with ease using axe DevTools Pro. Try for free!

Download Video
(Only MVP Supporters can download original high-quality recordings for offline viewing.)

This is the video screencast version of a blog post I did not long ago: Useful Flexbox Technique: Alignment Shifting Wrapping. I was at a CodePen Meetup and used it as a quick show-and-tell demo and it was kinda fun so, you know, RECYCLING.

We have a title/subtitle situation with a very specific layout in mind that we want to behave a certain way responsively. We eventually get there with Flexbox, but we explore lots of CSS positioning stuff along the way for fun.

See the Pen Wrapping Same-Line Titles by Chris Coyier (@chriscoyier) on CodePen.