Episode 44: CSS, Sass, and Playwriting with Miriam Suzanne - a podcast by The Enjoy the Vue Team

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 (https://twitter.com/mirisuzanne)- Miriam Suzanne on LinkedIn (https://www.linkedin.com/in/mirisuzanne/)
- Miriam Suzanne on GitHub (https://github.com/mirisuzanne)- Miriam Suzanne (https://www.miriamsuzanne.com/)
- OddBird (https://www.oddbird.net/)- Teacup Gorilla (https://www.teacupgorilla.com/)
- Grapefruit Lab (https://www.grapefruitlab.com/)- Riding Sidesaddle* (http://www.springgunpress.com/riding-sidesaddle-miriam-suzanne/)
- The Post-Obsolete Book (http://www.post-obsolete.com/)- Why is CSS So Weird? (https://youtu.be/aHUtMbJw8iA)
- Storybook (https://storybook.js.org/)- Mozilla Developer on YouTube (https://www.youtube.com/channel/UCh5UlGiu9d6LegIeUCW4N1w)
- CSS The Card Game (https://github.com/hanilim/css-the-card-game)- Tierney's gist for playing Among Us "locally" (https://gist.github.com/bnb/b3775122759fe22c9628ac284bd96bfb)
- Theragun (https://www.theragun.com/)- Funny (https://youtu.be/uDE5ygucFyY)
- Style Stages by Stephanie Eckles (https://stylestage.dev/)- Layout Land on YouTube (https://www.youtube.com/c/LayoutLand)
- ASLU Dictionary by Bill Vicars (https://www.lifeprint.com/)Freedom is a Constant Struggle (https://www.amazon.com/Freedom-Constant-Struggle-Palestine-Foundations/dp/1608465640)- Queen (https://youtu.be/Z7OSSUwPVM4)
- Incomplete List of Mistakes in the Design of CSS (https://wiki.csswg.org/ideas/mistakes)- Enjoy the Vue on Twitter (https://twitter.com/enjoythevuecast?lang=en)
- Enjoy the Vue (https://enjoythevue.io/) Special Guest: Miriam Suzanne.

Further episodes of Enjoy the Vue

Further podcasts by The Enjoy the Vue Team

Website of The Enjoy the Vue Team