m_ott’s avatarm_ott’s Twitter Archive—№ 20,460

    1. Help argyleink and TerribleMia pick a syntax for CSS nesting. 👇 developer.chrome.com/blog/help-css-nesting/
      OpenGraph image for developer.chrome.com/blog/help-css-nesting/
      Permalink On twitter.com Twitter logo m_ott’s avatar ♻️ 2 Retweets ❤️ 3 Favorites 2022 Jul 29 Mood +3 🙂
  1. …in reply to @m_ott
    My favorite by far: option 1. Maybe because it’s the most familiar syntax. Being able to place the context anywhere with @​nest also feels like a useful additional feature. So I don’t perceive it as being that hard to remember when to use & and when @​nest.
    On twitter.com Twitter logo m_ott’s avatar 2022 Jul 29 Mood +5 🙂
    1. …in reply to @m_ott
      Option 2 is full of @​nest @​nest @​nest @​nest @​nest @​nest which are visually dominant and make it hard to focus on the “real” selectors.
      Permalink On twitter.com Twitter logo m_ott’s avatar 2022 Jul 29 Mood -1 🙁
      1. …in reply to @m_ott
        And option 3 just irritates me. 😅 The additional opening { bracket without a selector in front of it, all the extra brackets – it looks like there are way too many curly brackets for the few selectors, especially with multiple levels.
        Permalink On twitter.com Twitter logo m_ott’s avatar 2022 Jul 29 Mood -1 🙁
        1. …in reply to @m_ott
          The additional curly brackets also push the nested rules one level further to the right which is also harder to read IMHO because it moves the rules further away from the “root” selector.
          Permalink On twitter.com Twitter logo m_ott’s avatar 2022 Jul 29 Mood 0