Enjoy the Vue

Episode 44: CSS, Sass, and Playwriting with Miriam Suzanne


Listen Later

Key Points From This Episode:

  • Miriam’s advice for getting started in CSS, especially those coming from other languages.
  • How CSS provides the tools to deal with its inherent and absurd lack of control.
  • The history of browsers with style capabilities and how CSS was a response to that idea.
  • We learn why Miriam is ambivalent to tools like Tachyon or Tailwind.
  • What developing Sass helped Miriam learn about CSS, and why Sass can’t contextualize the complexity of CSS for users.
  • The design systems approach Miriam chooses, depending on the client, and she loves Sass.
  • Addressing scoping – Miriam describes how her preferred tool, View Solution works.
  • Some common scoping or CSS patterns that Miriam disagrees with, and the patterns or paradigms she thinks deserve more attention.
  • Miriam talks about the CSS spec work she is doing and why she felt the need to do it.
  • Problem-solving when debugging – Miriam suggests looking at browser dev tools and property when inspecting an element.
  • Miriam explains the layout models in CSS, and how others can understand them better.
  • CSS is communicating meaningfully to the browser, how to make smart decisions for us.
  • Masonry layout – what it is, why it’s considered the holy grail layout, why it’s tough to build.
  • CSS, specs, browser implementation, and rules – Miriam lays out what CSS actually is.
  • Which of the things that are broken or unintuitive in CSS Miriam would like to change.
  • The panel shares the worst thing they have done in CSS and the thing they are proudest of.
  • Miriam shares her worst CSS experience, which was during the height of maintaining Susy.
  • Tessa’s picks include Mozilla Developer videos and CSS The Card Game.
  • Ben’s picks this week involve fixing back pain with a massage gun and a song called Funny.
  • Miriam shares her picks, including A CSS showcase called Style Stage, the Layout Land videos, and an ASL dictionary.
  • To close the show is Ari’s pick, which is simply Queen by Perfume Genius.
  • Tweetables:

    • “[CSS is] a collaboration with browsers and with users, everything is contextual, it's meant to be that way. Browser differences are a feature, your code breaking is a feature… That’s just the way it is. It’s one weird big performance art.” — @mirisuzanne [0:02:36]
    • “CSS is all about communicating meaningfully to the browser how to make smart decisions for us. Telling it this is a flex situation, or this is a grid situation, or this is a float situation is meaningful information that the browser can use to make decisions on our behalf in contexts we haven't thought about.” — @mirisuzanne [0:34:18]
    • “My key to writing CSS is always try to convey as much information as we can to the browser in small ways.” — @mirisuzanne [0:34:28]
    • “Responsive web design taught us to remove all intrinsic sizes and put a percentage on everything, everything is fluid. If you’ve ever heard Jen Simmons talk about intrinsic design, she's trying to push back on that one aspect of responsive.” — @mirisuzanne [0:47:44]
    • Links Mentioned in Today’s Episode:

      • Miriam Suzanne on Twitter
      • Miriam Suzanne on LinkedIn
      • Miriam Suzanne on GitHub
      • Miriam Suzanne
      • OddBird
      • Teacup Gorilla
      • Grapefruit Lab
      • Riding Sidesaddle*
      • The Post-Obsolete Book
      • Why is CSS So Weird?
      • Storybook
      • Mozilla Developer on YouTube
      • CSS The Card Game
      • Tierney's gist for playing Among Us "locally"
      • Theragun
      • Funny
      • Style Stages by Stephanie Eckles
      • Layout Land on YouTube
      • ASLU Dictionary by Bill VicarsFreedom is a Constant Struggle
      • Queen
      • Incomplete List of Mistakes in the Design of CSS
      • Enjoy the Vue on Twitter
      • Enjoy the Vue
      • Special Guest: Miriam Suzanne.

        Support Enjoy the Vue

        ...more
        View all episodesView all episodes
        Download on the App Store

        Enjoy the VueBy The Enjoy the Vue Team

        • 3.6
        • 3.6
        • 3.6
        • 3.6
        • 3.6

        3.6

        7 ratings