MastodonTech.de

Inautilo<a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#Development</a> <a href="https://mastodon.social/tags/Launches" class="mention hashtag" rel="nofollow noopener" target="_blank">#Launches</a> CSS Boilerplate · A default CSS structure for projects of any size <a href="https://ilo.im/163i67" rel="nofollow noopener" translate="no" target="_blank">https://ilo.im/163i67</a>_____ <a href="https://mastodon.social/tags/Boilerplate" class="mention hashtag" rel="nofollow noopener" target="_blank">#Boilerplate</a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> <a href="https://mastodon.social/tags/CssReset" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssReset</a> <a href="https://mastodon.social/tags/CssNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssNesting</a> <a href="https://mastodon.social/tags/WebPerf" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebPerf</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a>

Inautilo<a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#Development</a> <a href="https://mastodon.social/tags/Techniques" class="mention hashtag" rel="nofollow noopener" target="_blank">#Techniques</a> Approaches to the ‘&’ selector in CSS · More maintainable, readable, and clever CSS nesting <a href="https://ilo.im/1628p2" rel="nofollow noopener" translate="no" target="_blank">https://ilo.im/1628p2</a>_____ <a href="https://mastodon.social/tags/ModernCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#ModernCSS</a> <a href="https://mastodon.social/tags/Maintainability" class="mention hashtag" rel="nofollow noopener" target="_blank">#Maintainability</a> <a href="https://mastodon.social/tags/Readability" class="mention hashtag" rel="nofollow noopener" target="_blank">#Readability</a> <a href="https://mastodon.social/tags/Ampersand" class="mention hashtag" rel="nofollow noopener" target="_blank">#Ampersand</a> <a href="https://mastodon.social/tags/CssNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssNesting</a> <a href="https://mastodon.social/tags/Framework" class="mention hashtag" rel="nofollow noopener" target="_blank">#Framework</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> <a href="https://mastodon.social/tags/Sass" class="mention hashtag" rel="nofollow noopener" target="_blank">#Sass</a>

Inautilo<a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#Development</a> <a href="https://mastodon.social/tags/Techniques" class="mention hashtag" rel="nofollow noopener" target="_blank">#Techniques</a> Conditional CSS grid template areas · A magic formula to “open the gates to layout heaven.” <a href="https://ilo.im/161t0f" rel="nofollow noopener" translate="no" target="_blank">https://ilo.im/161t0f</a>_____ <a href="https://mastodon.social/tags/Layout" class="mention hashtag" rel="nofollow noopener" target="_blank">#Layout</a> <a href="https://mastodon.social/tags/CssGrid" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssGrid</a> <a href="https://mastodon.social/tags/CssNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssNesting</a> <a href="https://mastodon.social/tags/ContainerQueries" class="mention hashtag" rel="nofollow noopener" target="_blank">#ContainerQueries</a> <a href="https://mastodon.social/tags/LogicalProperties" class="mention hashtag" rel="nofollow noopener" target="_blank">#LogicalProperties</a> <a href="https://mastodon.social/tags/ResponsiveDesign" class="mention hashtag" rel="nofollow noopener" target="_blank">#ResponsiveDesign</a> <a href="https://mastodon.social/tags/WebDesign" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDesign</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a>

Inautilo<a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#Development</a> <a href="https://mastodon.social/tags/Techniques" class="mention hashtag" rel="nofollow noopener" target="_blank">#Techniques</a> Fun with custom cursors · Two ways to change the default cursor appearance <a href="https://ilo.im/160i1z" rel="nofollow noopener" translate="no" target="_blank">https://ilo.im/160i1z</a>_____ <a href="https://mastodon.social/tags/Cursor" class="mention hashtag" rel="nofollow noopener" target="_blank">#Cursor</a> <a href="https://mastodon.social/tags/Customization" class="mention hashtag" rel="nofollow noopener" target="_blank">#Customization</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> <a href="https://mastodon.social/tags/CssCursor" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssCursor</a> <a href="https://mastodon.social/tags/CssNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssNesting</a> <a href="https://mastodon.social/tags/CustomProperties" class="mention hashtag" rel="nofollow noopener" target="_blank">#CustomProperties</a> <a href="https://mastodon.social/tags/JavaScript" class="mention hashtag" rel="nofollow noopener" target="_blank">#JavaScript</a> <a href="https://mastodon.social/tags/React" class="mention hashtag" rel="nofollow noopener" target="_blank">#React</a>

Inautilo<a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#Development</a> <a href="https://mastodon.social/tags/Releases" class="mention hashtag" rel="nofollow noopener" target="_blank">#Releases</a> CSS nesting improves · It gets much better with CSSNestedDeclarations <a href="https://ilo.im/160ct5" rel="nofollow noopener" translate="no" target="_blank">https://ilo.im/160ct5</a>_____ <a href="https://mastodon.social/tags/ModernCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#ModernCSS</a> <a href="https://mastodon.social/tags/CssNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CssNesting</a> <a href="https://mastodon.social/tags/Specification" class="mention hashtag" rel="nofollow noopener" target="_blank">#Specification</a> <a href="https://mastodon.social/tags/Declaration" class="mention hashtag" rel="nofollow noopener" target="_blank">#Declaration</a> <a href="https://mastodon.social/tags/Coding" class="mention hashtag" rel="nofollow noopener" target="_blank">#Coding</a> <a href="https://mastodon.social/tags/Browser" class="mention hashtag" rel="nofollow noopener" target="_blank">#Browser</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a>

Yohan Yukiya Sese Cuneta 사요한🦣I just found out today that <a href="https://c.im/tags/CSSnesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSSnesting</a> is now out and supported by major browsers. I've completely forgotten about it when it first showed up as a CSSWG draft.Hooray!<a href="https://c.im/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> ---P.S.This is why I chose to create my own boilerplate from scratch. If I opted to use existing ones, what I'll be learning is “how to use their work” instead of “what's new in CSS”.

ansuz / ऐरनthis is a bit of a nerdy thing to be excited about, but built-in CSS nesting[1] is a browser feature that I've wanted for a long time and it's expected to be included in Firefox 117, which will release at the end of August[2].The other big browsers[3] browsers already implement it, so once it's included in firefox it will have pretty wide support.Many web developers find this syntax easier to read and write, but since it wasn't a native feature of CSS many people write their styles in a different language (of which there are many competing standards) and then use a third-party tool to compile their code into something the browser understands. Having a unified standard could make it easier to reuse code across different projects, and for junior devs to avoid having to learn several languages that all do the same thing.[1]: <a href="https://caniuse.com/css-nesting" rel="nofollow noopener" target="_blank">https://caniuse.com/css-nesting</a> [2]: <a href="https://wiki.mozilla.org/index.php?title=Release_Management/Calendar&redirect=no" rel="nofollow noopener" target="_blank">https://wiki.mozilla.org/index.php?title=Release_Management/Calendar&redirect=no</a> [3]: chrome and safari, because almost everything counts as one of those<a href="https://social.cryptography.dog/tags/webdev" class="mention hashtag" rel="nofollow noopener" target="_blank">#webdev</a> <a href="https://social.cryptography.dog/tags/css" class="mention hashtag" rel="nofollow noopener" target="_blank">#css</a> <a href="https://social.cryptography.dog/tags/cssNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#cssNesting</a>

Keith J GrantI think we're going to regret <a href="https://front-end.social/tags/CSSNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSSNesting</a>, at least the way it’s defined in the spec.<a href="https://front-end.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> has been going in a very strong direction for the past five years. There just aren’t any more “gotchas” or confusing/misleading parts of modern CSS, because the W3C has worked their asses off essentially refactoring them all away... except nesting.I think the sheer number of articles and posts coming out about “the gotchas of CSS nesting” should be a significant indicator to... <a href="https://notes.keithjgrant.com/notes/2023/06/i-think-were-going-to-regret/" rel="nofollow noopener" target="_blank">https://notes.keithjgrant.com/notes/2023/06/i-think-were-going-to-regret/</a>

Angie Radtke<a href="https://front-end.social/@jensimmons" class="u-url mention" rel="nofollow noopener" target="_blank">@jensimmons</a> <a href="https://mastodon.social/tags/CSSNesting" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSSNesting</a> great

Frühere Suchanfragen

Suchoptionen

Verwaltet von:

Serverstatistik:

#cssnesting