kubikpixel, to webdev
@kubikpixel@chaos.social avatar

Oh look, in the future I won't have to worry about the invisibility of dialog boxes on websites because of their overlay.

☝️ Popover API
https://developer.mozilla.org/en-US/docs/Web/API/Popover_API

—

cobweb, to random
@cobweb@corteximplant.com avatar

How are ya'll users doing images? I kind of want to add that to my daily thing but hmm. Surely there's a plugin for that?

secupriv,
@secupriv@mastodon.nl avatar

@cobweb I am curious too. By default you can set a size like this ![[image.png|pixels]]

Aligning an #image can be done using a #CSS like below and embed it like this ![[image.png#center|300]] but it’s a hassle to edit text along side the image when not in source mode.

divsrc$="[#left"] {
text-align:left;
}

divsrc$="[#center"] {
text-align:center;
}

divsrc$="[#right"] {
float:right;
}

A better solution would be great!

#Obsidian @obsidianmd #Obsidianmd

spaceninja, to CSS
@spaceninja@mastodon.cloud avatar

isn’t real, they have played us for absolute fools https://cssisntreal.com

h4kor, to design German
@h4kor@chaos.social avatar

I removed PicoCSS from my blog and built my own stylesheet. I'm still lacking a good understanding of basic design principles.

Can anyone recommend resources to learn about basic ?

inautilo, to music
@inautilo@mastodon.social avatar

#Development #Surprises
Printing music with CSS Grid · A fantastic showcase of what CSS Grid is capable of https://ilo.im/15yrr6

#Music #MusicNotation #CssGrid #WebDev #Frontend #SVG #HTML #CSS #JavaScript

CSSence, to CSS
@CSSence@mas.to avatar

Basics: The flow-root display value.
https://cssence.com/2024/display-flow-root/

iamdtms,
@iamdtms@mas.to avatar

@CSSence I'm trying not to use floats in the age of flexbox & grid.

css, to CSS
@css@front-end.social avatar

💡 CSS Tip!

How much code is needed to create a Sparkle shape? ✨
Only one gradient and you can easily get the border-only variation.

Demo: https://codepen.io/t_afif/full/eYaYzxX via :codepen: @codepen

Online Version: https://css-tip.com/sparkle-shape/

Two sparkle shapes. The second one is a border-only variation.

pawelgrzybek, to CSS
@pawelgrzybek@mastodon.social avatar

This is absolutely nuts! Great article that I learned tons from.

#css
https://vis.social/@yuanchuan/112386578533795188

WebAxe, to CSS
@WebAxe@a11y.info avatar

text spacing bookmarklet

Quick and dirty testing of WCAG 2.1 Success Criterion 1.4.12 Text Spacing

https://codepen.io/stevef/pen/YLMqbo/

stvfrnzl, to Nirvana
@stvfrnzl@mastodon.online avatar

To honor the late , I turned his letter to into a friendly website, using only , and :

https://stevefrenzel.github.io/steve-albini-letter/

Thanks to @thebishopgame who provided a link to the letter: https://wandering.shop/@thebishopgame/112406577143090727

Hopefully no typos in there! Also it respects your choice of color theme. 🤗

artlung, to CSS
@artlung@xoxo.zone avatar

Front End Study Hall continues! https://artlung.com/blog/2024/05/08/front-end-study-hall-continues/

tripplehelix, to CSS
@tripplehelix@fosstodon.org avatar

Published my current #nationwide #userstyle if you'd like to use it.

https://userstyles.world/style/16201/helixs-nationwide

#css

css, to CSS
@css@front-end.social avatar

💡CSS Tip!

Using the new relative color syntax, you can easily extract the R,G,B channels of any color and use them as separate colors.

Useful when you want to do some color manipulation.

Online Version: https://css-tip.com/rgb-channels/

#CSS #HTML

css,
@css@front-end.social avatar

You can do the same thing with a different syntax using the color() function.

In both cases, you can either use "none" or "0". "none" is equivalent to "0" but has a special behavior when color interpolation is in play.

#CSS #HTML

symfonystation, to Symfony
@symfonystation@newsletter.mobileatom.net avatar

Explore the May 12, 2023 @SymfonyStation Communiqué of Symfony, Drupal, PHP, Fediverse, and Cybersecurity news for evergreen content.

https://symfonystation.mobileatom.net/Symfony-Station-Communique-12-May-2023

🇺🇦

https://newsletter.mobileatom.net/1036225-2/

thomasweibel, to CSS German
@thomasweibel@swiss.social avatar

Sich bei -Fehlern und ärgern.

infoq, to CSS
@infoq@techhub.social avatar

Many developers use CSS frameworks to reduce boilerplate, increase quality & drive consistency. Good in theory - not always in practice.

Instead of using a , you should write your own custom . This is the best option!

Dive into Tyson Gern's article on to learn more: https://bit.ly/4aYEELL

ayo, to CSS
@ayo@ayco.io avatar

hey css wizards, why does dialog::backdrop not work when the dialog is open on load?

pen: https://codepen.io/ayoayco-the-styleful/pen/RwmbxKx

J12t, to CSS
@J12t@social.coop avatar

Today I learned:

display: flow-root

which solves a real problem for me. https://stackoverflow.com/questions/78439601/shrink-border-of-a-html-element-which-shares-space-with-a-floating-element #CSS

iamdtms, to CSS
@iamdtms@mas.to avatar

pop (is) over
https://codepen.io/iamdtms/pen/XWwrNaZ

joelanman, to CSS
@joelanman@hachyderm.io avatar

Is setting up a CSS grid, then having row divs with display: contents so its contents line up with grid a common pattern? Any pitfalls?
#css

hywan, to CSS
@hywan@fosstodon.org avatar

Printing music with CSS Grid, https://cruncher.ch/blog/printing-music-with-css-grid/.

The article presents an elegant way to display/render music notation with CSS (and a bit of SVG for symbols).

stvfrnzl, (edited ) to legal
@stvfrnzl@mastodon.online avatar

Currently studying for the exam and I found the part surprisingly interesting. This topic was also relevant in a workshop I gave, so here's a couple of law suits that are related:

https://stevefrenzel.dev/posts/five-web-accessibility-law-suits/

I'm happy to expand this list if you know other interesting cases. 🤗

pawelgrzybek, to CSS
@pawelgrzybek@mastodon.social avatar

@bramus is on fire. Another incredible resource by this fella!

Introducing "Unleash the power of Scroll-Driven Animations"

https://developer.chrome.com/blog/scroll-driven-animations-video-course

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • megavids
  • kavyap
  • DreamBathrooms
  • thenastyranch
  • magazineikmin
  • khanakhh
  • InstantRegret
  • Youngstown
  • ngwrru68w68
  • slotface
  • rosin
  • tacticalgear
  • mdbf
  • Durango
  • JUstTest
  • modclub
  • osvaldo12
  • ethstaker
  • cubers
  • normalnudes
  • everett
  • tester
  • GTA5RPClips
  • Leos
  • cisconetworking
  • provamag3
  • anitta
  • lostlight
  • All magazines
    •