DEV Community

Enjoy the Vue

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

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:

Special Guest: Miriam Suzanne.

Episode source