Recent searches

No recent searches

Search options

Only available when logged in.
shakedown.social is one of the many independent Mastodon servers you can use to participate in the fediverse.
A community for live music fans with roots in the jam scene. Shakedown Social is run by a team of volunteers (led by @clifff and @sethadam1) and funded by donations.

Administered by:

Server stats:

267
active users

shakedown.social: AboutStatusProfiles directoryPrivacy policy

Mastodon: AboutGet the appKeyboard shortcutsView source codev4.4.2

#flexbox

0 posts0 participants0 posts today
Frontend Dogma<p>Masonry, Item Flow, and… GULP?, by <span class="h-card" translate="no"><a href="https://mastodon.social/@Meyerweb" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>Meyerweb</span></a></span>:</p><p><a href="https://meyerweb.com/eric/thoughts/2025/05/21/masonry-item-flow-and-gulp/?_bhlid=4416223e6b626c5e6bbfef00ce9ad47789aa40e3" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">meyerweb.com/eric/thoughts/202</span><span class="invisible">5/05/21/masonry-item-flow-and-gulp/?_bhlid=4416223e6b626c5e6bbfef00ce9ad47789aa40e3</span></a></p><p><a href="https://mas.to/tags/css" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>css</span></a> <a href="https://mas.to/tags/masonry" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>masonry</span></a> <a href="https://mas.to/tags/flexbox" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>flexbox</span></a> <a href="https://mas.to/tags/grids" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>grids</span></a> <a href="https://mas.to/tags/layout" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>layout</span></a></p>
Nicolas Hoizey<p>“Item Flow, Part 1: A new unified concept for layout” by <span class="h-card" translate="no"><a href="https://front-end.social/@jensimmons" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>jensimmons</span></a></span>, Saron Yitbarek, Elika Etemad and Brandon Stewart</p><p>🔗 <a href="https://webkit.org/blog/16587/item-flow-part-1-a-new-unified-concept-for-layout/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">webkit.org/blog/16587/item-flo</span><span class="invisible">w-part-1-a-new-unified-concept-for-layout/</span></a></p><p>&gt; As we worked through the details, we started to get excited. Suddenly new features for Flexbox and Grid that people have wanted for years had an obvious home. Things seemed to click together elegantly. New capabilities emerged</p><p>This is really an exciting…</p><p><a href="https://mamot.fr/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> <a href="https://mamot.fr/tags/Masonry" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Masonry</span></a> <a href="https://mamot.fr/tags/Grid" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Grid</span></a> <a href="https://mamot.fr/tags/Flexbox" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Flexbox</span></a></p><p>⚓️ <a href="https://nicolas-hoizey.com/links/2025/04/01/item-flow-part-1-a-new-unified-concept-for-layout/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">nicolas-hoizey.com/links/2025/</span><span class="invisible">04/01/item-flow-part-1-a-new-unified-concept-for-layout/</span></a></p>
Matti Järvinen<p>Pretty happy how my HTML DM screen pages turned out and are even printable. Here's the last page.</p><p>CSS border-image-source and slices used with the box border ( not your 00's average borders anymore ).</p><p>Note: CSS mix-blend-mode: multiply used on the AI illustration (I suck at drawing) to let the white pass through as transparent to get a look it's painted on top of the paper.</p><p>Works 👍 on both A4 and Letter size. </p><p><a href="https://mastodon.social/tags/DnD" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>DnD</span></a> <a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>HTML</span></a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> <a href="https://mastodon.social/tags/FlexBox" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>FlexBox</span></a> <a href="https://mastodon.social/tags/AI" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>AI</span></a></p>
Luke Dorny<p>Yes, but Should I?</p><p><a href="https://typo.social/tags/blog" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>blog</span></a> <a href="https://typo.social/tags/design" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>design</span></a> <a href="https://typo.social/tags/gallery" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gallery</span></a> <a href="https://typo.social/tags/artwork" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>artwork</span></a> <a href="https://typo.social/tags/shop" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>shop</span></a> <a href="https://typo.social/tags/products" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>products</span></a> <a href="https://typo.social/tags/records" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>records</span></a> <a href="https://typo.social/tags/magazine" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>magazine</span></a> <a href="https://typo.social/tags/photos" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>photos</span></a> <a href="https://typo.social/tags/objects" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>objects</span></a> <a href="https://typo.social/tags/posts" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>posts</span></a> <a href="https://typo.social/tags/uses" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>uses</span></a> <a href="https://typo.social/tags/now" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>now</span></a> <a href="https://typo.social/tags/blogroll" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>blogroll</span></a> <a href="https://typo.social/tags/projects" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>projects</span></a> <a href="https://typo.social/tags/ecommerce" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>ecommerce</span></a> <a href="https://typo.social/tags/cms" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>cms</span></a> <a href="https://typo.social/tags/relatedPages" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>relatedPages</span></a> <a href="https://typo.social/tags/grid" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>grid</span></a> <a href="https://typo.social/tags/flexbox" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>flexbox</span></a> <a href="https://typo.social/tags/css" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>css</span></a> <a href="https://typo.social/tags/ally" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>ally</span></a> <a href="https://typo.social/tags/php" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>php</span></a> <a href="https://typo.social/tags/coffee" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>coffee</span></a></p>
Luke Dorny<p>If I’m blunt with myself I’ve already bit off more than I can reasonably chew in a reasonable amount of time, lol. </p><p><a href="https://typo.social/tags/blog" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>blog</span></a> <a href="https://typo.social/tags/design" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>design</span></a> <a href="https://typo.social/tags/gallery" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>gallery</span></a> <a href="https://typo.social/tags/artwork" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>artwork</span></a> <a href="https://typo.social/tags/shop" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>shop</span></a> <a href="https://typo.social/tags/products" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>products</span></a> <a href="https://typo.social/tags/records" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>records</span></a> <a href="https://typo.social/tags/magazine" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>magazine</span></a> <a href="https://typo.social/tags/photos" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>photos</span></a> <a href="https://typo.social/tags/objects" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>objects</span></a> <a href="https://typo.social/tags/posts" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>posts</span></a> <a href="https://typo.social/tags/uses" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>uses</span></a> <a href="https://typo.social/tags/now" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>now</span></a> <a href="https://typo.social/tags/blogroll" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>blogroll</span></a> <a href="https://typo.social/tags/projects" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>projects</span></a> <a href="https://typo.social/tags/ecommerce" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>ecommerce</span></a> <a href="https://typo.social/tags/cms" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>cms</span></a> <a href="https://typo.social/tags/relatedPages" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>relatedPages</span></a> <a href="https://typo.social/tags/grid" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>grid</span></a> <a href="https://typo.social/tags/flexbox" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>flexbox</span></a> <a href="https://typo.social/tags/css" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>css</span></a> <a href="https://typo.social/tags/ally" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>ally</span></a> <a href="https://typo.social/tags/php" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>php</span></a> oh, and <a href="https://typo.social/tags/coffee" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>coffee</span></a></p>
Aral Balkan<p>Laura’s* Penpot** session, Introduction to Flex and Grid Layout, will be live streamed via Peertube tomorrow from 2-3 PM UTC at <a href="https://peertube.kaleidos.net/w/g5F9Se2PK2934EFrLSuJ16" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">peertube.kaleidos.net/w/g5F9Se</span><span class="invisible">2PK2934EFrLSuJ16</span></a></p><p>* <span class="h-card" translate="no"><a href="https://mastodon.laurakalbag.com/@laura" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>laura</span></a></span> <br>** <span class="h-card" translate="no"><a href="https://fosstodon.org/@penpot" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>penpot</span></a></span> </p><p><a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>web</span></a> <a href="https://mastodon.ar.al/tags/design" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>design</span></a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dev</span></a> <a href="https://mastodon.ar.al/tags/FOSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>FOSS</span></a> <a href="https://mastodon.ar.al/tags/grid" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>grid</span></a> <a href="https://mastodon.ar.al/tags/flexBox" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>flexBox</span></a> <a href="https://mastodon.ar.al/tags/PenPot" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>PenPot</span></a></p>
David L Schafer 🥭<p>I have the opportunity to do a redesign of a very large site that I built about 5 years ago and have maintained since. Looking to brush up on the newer <a href="https://ohai.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>CSS</span></a> / <a href="https://ohai.social/tags/JS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>JS</span></a> that’s available to me for <a href="https://ohai.social/tags/frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>frontend</span></a>. The current site was built with <a href="https://ohai.social/tags/JQuery" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>JQuery</span></a> and <a href="https://ohai.social/tags/flexbox" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>flexbox</span></a> was not even an option at the time. Would love to move to <a href="https://ohai.social/tags/vanillaJS" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>vanillaJS</span></a> for most things and get the most out of flexbox that I can.</p><p>Looking for good resources, if anyone knows of any.</p>
TrendingLive feeds
About