Create accountLogin

Recent searches

No recent searches

Search options

Only available when logged in.
eupolicy.social is one of the many independent Mastodon servers you can use to participate in the fediverse.
This Mastodon server is a friendly and respectful discussion space for people working in areas related to EU policy. When you request to create an account, please tell us something about you.

Administered by:

Server stats:

218
active users

eupolicy.social: AboutProfiles directoryPrivacy policy

Mastodon: AboutGet the appKeyboard shortcutsView source codev4.3.6

#borderimage

0 posts0 participants0 posts today
Ana Tudor 🐯<p>2️⃣ 1076 ♥️ Simplest inner glow card animation <a href="https://codepen.io/thebabydino/pen/WNVPdJg" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/thebabydino/pen/WNV</span><span class="invisible">PdJg</span></a> - a super simple pure <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> demo I made in a few minutes to answer a reddit question and never expected would even get noticed much. It was my only 2024 demo to make into the most hearted 100 Pens of the year on <span class="h-card" translate="no"><a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>codepen</span></a></span>. </p><p><a href="https://mastodon.social/tags/cssFilter" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>cssFilter</span></a> <a href="https://mastodon.social/tags/borderImage" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>borderImage</span></a> <a href="https://mastodon.social/tags/glow" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>glow</span></a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>code</span></a> <a href="https://mastodon.social/tags/cssGradient" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>cssGradient</span></a> <a href="https://mastodon.social/tags/conicGradient" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>conicGradient</span></a> <a href="https://mastodon.social/tags/coding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>coding</span></a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>web</span></a> <a href="https://mastodon.social/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>dev</span></a> <a href="https://mastodon.social/tags/webDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webDevelopment</span></a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webDev</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a></p>
Ana Tudor 🐯<p>Know how border-image &amp; border-radius don't play nice together?</p><p>(interactive <a href="https://codepen.io/thebabydino/pen/jxZyed" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/thebabydino/pen/jxZ</span><span class="invisible">yed</span></a>)</p><p><a href="https://mastodon.social/tags/tinyCSStip" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>tinyCSStip</span></a> there's a workaround IF corner radius ≤ border-width: use inset() clip-path + a round value!</p><p>clip-path: inset(0 round $r)</p><p><span class="h-card" translate="no"><a href="https://fosstodon.org/@codepen" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>codepen</span></a></span> demo: <a href="https://codepen.io/thebabydino/pen/qBELJGY?editors=1100" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">codepen.io/thebabydino/pen/qBE</span><span class="invisible">LJGY?editors=1100</span></a></p><p>(and yes, this is a tip I first shared on twitter over half a decade ago <a href="https://x.com/anatudor/status/1219916121341644807" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">x.com/anatudor/status/12199161</span><span class="invisible">21341644807</span></a> )</p><p><a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> <a href="https://mastodon.social/tags/clipPath" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>clipPath</span></a> <a href="https://mastodon.social/tags/cssClipPath" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>cssClipPath</span></a> <a href="https://mastodon.social/tags/coding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>coding</span></a> <a href="https://mastodon.social/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>web</span></a> <a href="https://mastodon.social/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>dev</span></a> <a href="https://mastodon.social/tags/webDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webDev</span></a> <a href="https://mastodon.social/tags/webDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webDevelopment</span></a> <a href="https://mastodon.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>code</span></a> <a href="https://mastodon.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a> <a href="https://mastodon.social/tags/borderImage" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>borderImage</span></a> <a href="https://mastodon.social/tags/borderRadius" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>borderRadius</span></a></p>
ExploreLive feeds
About