Dennis Frank
@freshmango.bsky.social
#CSS problem: Parent won’t scale to child height when using percentage for `valueToRound` in `round()`:
`.child { block-size: round(up, 100%, 5lh) }`
Circular issue? Ideas for an elegant solutions?
CodePen: codepen.io/df/pen/myVXw...
round(): developer.mozilla.org/en-US/docs/W...
#HTML #webbed
`.child { block-size: round(up, 100%, 5lh) }`
Circular issue? Ideas for an elegant solutions?
CodePen: codepen.io/df/pen/myVXw...
round(): developer.mozilla.org/en-US/docs/W...
#HTML #webbed
round() with percentage – parent sizing
...
codepen.io
October 20, 2025 at 8:10 PM
#CSS problem: Parent won’t scale to child height when using percentage for `valueToRound` in `round()`:
`.child { block-size: round(up, 100%, 5lh) }`
Circular issue? Ideas for an elegant solutions?
CodePen: codepen.io/df/pen/myVXw...
round(): developer.mozilla.org/en-US/docs/W...
#HTML #webbed
`.child { block-size: round(up, 100%, 5lh) }`
Circular issue? Ideas for an elegant solutions?
CodePen: codepen.io/df/pen/myVXw...
round(): developer.mozilla.org/en-US/docs/W...
#HTML #webbed
Most important update of the WWDC: Anchor Positioning! 🥰https://webkit.org/blog/16993/news-from-wwdc25-web-technology-coming-this-fall-in-safari-26-beta/#anchor-positioning
June 9, 2025 at 8:00 PM
Most important update of the WWDC: Anchor Positioning! 🥰https://webkit.org/blog/16993/news-from-wwdc25-web-technology-coming-this-fall-in-safari-26-beta/#anchor-positioning
Reposted by Dennis Frank
thanks for asking! This is the document I was referring to in my response w3c.github.io/sustainablew...
w3c.github.io
June 7, 2025 at 9:19 AM
thanks for asking! This is the document I was referring to in my response w3c.github.io/sustainablew...
Reposted by Dennis Frank
I just realized that today is #CSSYesterday.
June 7, 2025 at 3:54 PM
I just realized that today is #CSSYesterday.
@hidde.blog @cssday.nl Do you think there is a need for official regulation and legislation regarding the energy consumption of digital products such as websites? Or are there already such initiatives? (Like we have with accessibility in the EU.) #cssday
June 6, 2025 at 3:04 PM
@hidde.blog @cssday.nl Do you think there is a need for official regulation and legislation regarding the energy consumption of digital products such as websites? Or are there already such initiatives? (Like we have with accessibility in the EU.) #cssday
🤯 @amitsheen.bsky.social is going to build a CPU in CSS now. Yeah… I mean… why not, right!? #cssday
June 6, 2025 at 12:10 PM
🤯 @amitsheen.bsky.social is going to build a CPU in CSS now. Yeah… I mean… why not, right!? #cssday
Styling form controls will be SO MUCH easier in the (hopefully not so far) future. @ntim.bsky.social demonstrates examples from the CSS Form Control Styling Level 1 specification draft (www.w3.org/TR/css-forms...) #cssday
June 6, 2025 at 10:32 AM
Styling form controls will be SO MUCH easier in the (hopefully not so far) future. @ntim.bsky.social demonstrates examples from the CSS Form Control Styling Level 1 specification draft (www.w3.org/TR/css-forms...) #cssday
Reposted by Dennis Frank
More anchors! @ishadeed.com #CSSDay
Truly amazing how powerful this next generation of responsive UI features is with :has(), anchors, container queries, style queries, *ALL THE THINGS*
(and there are so so many more)
Truly amazing how powerful this next generation of responsive UI features is with :has(), anchors, container queries, style queries, *ALL THE THINGS*
(and there are so so many more)
June 6, 2025 at 9:35 AM
More anchors! @ishadeed.com #CSSDay
Truly amazing how powerful this next generation of responsive UI features is with :has(), anchors, container queries, style queries, *ALL THE THINGS*
(and there are so so many more)
Truly amazing how powerful this next generation of responsive UI features is with :has(), anchors, container queries, style queries, *ALL THE THINGS*
(and there are so so many more)
So, so true. The gap between design tools and the possibilities of the CSS based web platform is
getting bigger year by year. @ishadeed.com at #cssday. (Reminds me of @matthiasott.com‘s talk last year cssday.nl/2024/#matthias)
getting bigger year by year. @ishadeed.com at #cssday. (Reminds me of @matthiasott.com‘s talk last year cssday.nl/2024/#matthias)
June 6, 2025 at 9:26 AM
So, so true. The gap between design tools and the possibilities of the CSS based web platform is
getting bigger year by year. @ishadeed.com at #cssday. (Reminds me of @matthiasott.com‘s talk last year cssday.nl/2024/#matthias)
getting bigger year by year. @ishadeed.com at #cssday. (Reminds me of @matthiasott.com‘s talk last year cssday.nl/2024/#matthias)
Reposted by Dennis Frank
A #sketchnotes for the talk "Multicol and fragmentation" by @rachelandrew.bsky.social at the @cssday.nl #cssday
June 5, 2025 at 3:11 PM
A #sketchnotes for the talk "Multicol and fragmentation" by @rachelandrew.bsky.social at the @cssday.nl #cssday
Implementing column-span is challenging (github.com/w3c/csswg-dr...). It could lead to many unwanted layout issues. @rachelandrew.bsky.social: “If something terrible happens, it should at least be spec'd so that the terrible thing happens the same in every browser.” #cssday
June 5, 2025 at 3:05 PM
Implementing column-span is challenging (github.com/w3c/csswg-dr...). It could lead to many unwanted layout issues. @rachelandrew.bsky.social: “If something terrible happens, it should at least be spec'd so that the terrible thing happens the same in every browser.” #cssday
Reposted by Dennis Frank
Great CSS trick documented by @ishadeed.com for showing conditional border radius (border radius on desktop, none on mobile)
border-radius: max(0px, min(8px, calc((100vw - 4px - 100%) * 9999))) / 8px;
(via @nerdy.dev at #CSSDay)
ishadeed.com/article/cond...
border-radius: max(0px, min(8px, calc((100vw - 4px - 100%) * 9999))) / 8px;
(via @nerdy.dev at #CSSDay)
ishadeed.com/article/cond...
Conditional Border Radius In CSS
How to use CSS comparison functions to create a conditional border radius
ishadeed.com
June 5, 2025 at 8:10 AM
Great CSS trick documented by @ishadeed.com for showing conditional border radius (border radius on desktop, none on mobile)
border-radius: max(0px, min(8px, calc((100vw - 4px - 100%) * 9999))) / 8px;
(via @nerdy.dev at #CSSDay)
ishadeed.com/article/cond...
border-radius: max(0px, min(8px, calc((100vw - 4px - 100%) * 9999))) / 8px;
(via @nerdy.dev at #CSSDay)
ishadeed.com/article/cond...
@cssday.nl @rachelandrew.bsky.social Why aren’t there logical margin at-rules, like for example @block-start-inline-end? Or wouldn’t it make sense for printed pages? And what about margin at-rules for columns in multi-column layouts? #cssday
June 5, 2025 at 2:43 PM
@cssday.nl @rachelandrew.bsky.social Why aren’t there logical margin at-rules, like for example @block-start-inline-end? Or wouldn’t it make sense for printed pages? And what about margin at-rules for columns in multi-column layouts? #cssday
I really like how open and transparent @cydstumpel.nl is. She always credits people who’ve offered advice in her talk about CSS view transitions. So much respect for live coding. #cssday
June 5, 2025 at 12:44 PM
I really like how open and transparent @cydstumpel.nl is. She always credits people who’ve offered advice in her talk about CSS view transitions. So much respect for live coding. #cssday
@cydstumpel.nl demonstrates how to pause CSS view transitions and use the `::view-transition` pseudo class (developer.mozilla.org/en-US/docs/W... ) to inspect and debug view transitions. #cssday
June 5, 2025 at 12:22 PM
@cydstumpel.nl demonstrates how to pause CSS view transitions and use the `::view-transition` pseudo class (developer.mozilla.org/en-US/docs/W... ) to inspect and debug view transitions. #cssday
June 5, 2025 at 11:56 AM
June 5, 2025 at 10:03 AM
“Complexity is a moving target. We can't make it go away. But we can move it around.” So, so true. @miriam.codes at #cssday
June 5, 2025 at 10:01 AM
“Complexity is a moving target. We can't make it go away. But we can move it around.” So, so true. @miriam.codes at #cssday
Such a nerdy, interesting and jam-packed first #cssday talk by @nerdy.dev. Too much stuff (in VERY good way) to live post here! Embrace native scroll functionality and enhance it gracefully. (and Adam took accessibility into account too). Check out his Code Pens and slides nerdy.dev/cssday-2025
June 5, 2025 at 9:12 AM
Such a nerdy, interesting and jam-packed first #cssday talk by @nerdy.dev. Too much stuff (in VERY good way) to live post here! Embrace native scroll functionality and enhance it gracefully. (and Adam took accessibility into account too). Check out his Code Pens and slides nerdy.dev/cssday-2025
Reposted by Dennis Frank
Reposted by Dennis Frank
