terribleMia’s avatarterribleMia’s Twitter Archive—№ 7,829

  1. You can use min() or max() *inside* minmax(), and the results are *great*. 😃 Just used: minmax(min-content, max(50vw, 60ch)) I love modern CSS so much. 1/2
    On twitter.com Twitter logo terribleMia’s avatar ♻️ 96 Retweets ❤️ 647 Favorites Mood +8 🙂
    1. …in reply to @TerribleMia
      This grid track will: - shrink to fit the content - expand only up to 60ch when there's space - then pause expanding until the viewport is 120ch - and start expanding again to retain half the viewport 2/2
      Permalink On twitter.com Twitter logo terribleMia’s avatar ♻️ 8 Retweets ❤️ 49 Favorites Mood +2 🙂
      1. …in reply to @TerribleMia
        3/2 for good measure: Combine this with auto & fractional tracks. Auto expands first, then minmax, then fractions. Then, minmax max() again. These are the "Stages of Squishiness" that jensimmons coined as part of Intrinsic Design, & part of only using "Media Queries As Needed"
        Permalink On twitter.com Twitter logo terribleMia’s avatar ♻️ 3 Retweets ❤️ 32 Favorites Mood +4 🙂
        1. …in reply to @TerribleMia
          A pen that roughly demonstrates the idea: codepen.io/mirisuzanne/pen/wvKErbK I could imagine also using clamp() to put another final max on this…
          Permalink On twitter.com Twitter logo terribleMia’s avatar ♻️ 1 Retweets ❤️ 25 Favorites Mood 0