benteh, to CSS

since no one at work is going to give me an award, i'll have to do it myself

erick, to webdev French
@erick@oisaur.com avatar

Je pensais avoir du boulot à partir de mi-avril mais ça tombe à l'eau et je me retrouve avec pas grand chose.
Si vous entendez parler de missions d'intégration / , je suis tout ouïe (comme les poissons).
J'aime le code propre et minimaliste, mettre en place les bonnes pratiques et j'ai des bases d' .

Le repouet repeuple les océans et les rivières de nos amis à écailles.

attacus, to webdev
@attacus@aus.social avatar

Today I built a silly webpage by hand in a couple of hours. (I’m not going to tell you what it was, except that it was frivolous af.)

I started out by looking for a template, but everything I found was way too involved, so I ended up writing the HTML and CSS from scratch, throwing it in a cloud-hosted directory, and nudging the DNS settings to point there.

This turned out to be a ridiculously nostalgic experience. I built a lot of weird little websites like this when I was about eleven years old, saving the HTML of sites that I liked so that I could access them when the phone line was being used by someone else, and changing pieces around to figure out how it all fit together.

It struck me that:
a) by this measure I’ve been doing web dev for almost a quarter-century now 😳
b) there is nothing stopping me from making websites this way. I can still write HTML and yeet it out there if I want to, no matter what it’s for. Pages load quickly. It’s not fancy. It works. Underneath it all, the web is still there.

If you feel so inclined, I can highly recommend seizing an afternoon, taking a silly webpage idea, and having a play.

davidbisset, to CSS
@davidbisset@phpc.social avatar

.dresser {
align-left: -20px;
}

#CSS #memes

collinsworth, to CSS
@collinsworth@hachyderm.io avatar

The question of whether CSS is a programming language serves only one purpose: to demote those who write it.

There is no confusion that needs to be clarified, and no other purpose to the debate beyond the most trivial kind of pedantry.

The debate itself is an act of gatekeeping, whether intentional or not. Its only meaningful effect is to elevate some work over other work, despite their nearly identical nature.

The only meaningful function of the question is segregation.

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

For the last 4 years, I got to spend most of my time on specs. I had a lead role in cascade layers, container queries, & scope (all shipping) – now responsive type & mixins/functions.

I hope to keep at it, but this is open-source work, and (like many others) my funding was suddenly cut this year. So I’m looking for sponsors.

For now, @OddBird will fund what we can. If you or your company would like to help, you can also support that work through Open Collective: https://opencollective.com/oddbird-open-source#category-ABOUT

kizu, to webdev
@kizu@front-end.social avatar

What if I will tell you how we could solve fit-to-width text with pure without any hardcoded parameters? Curiously, scroll-driven animations will allow us to do just that!

Welcome my new article — “Fit-to-Width Text” — where I continue exploring the experimental implementations of the latest specs.

https://kizu.dev/fit-to-width-text/

A screen recording of an example showing a text written down symbol by symbol in a way, where each line fits to the width of the container. The following text is written over five lines: “What if I will tell you how we could use scroll-driven animations to solve fit-to-width text? Third line (“scroll-driven animations”) is in italic, fourth line (“to solve”) is in bold.

5t3ph, to CSS
@5t3ph@front-end.social avatar

📝 Fresh post:

12 Modern One-Line Upgrades

Sometimes, improving your application CSS just takes a one-line upgrade or enhancement! Learn about 12 properties to start incorporating into your projects, and enjoy reducing technical debt, removing JavaScript, and scoring easy wins for user experience.

https://moderncss.dev/12-modern-css-one-line-upgrades/

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

Dear people who make websites,

Now that Safari 17.4 is available, what other new web technology — HTML, CSS, JS, Web API, media support, etc — would you like to see supported in Safari next?

What’s most needed?
What will you use it for?
Or how will it help your team serve your users?
Tell me a story…

rolle, to mastodon
@rolle@mementomori.social avatar

Fedi on Fire first beta is now released! I just had to try and do it... Watch those endless Fediverse posts flow! :meow_hearteyes: Check it out at https://fedionfire.stream

Gif animation of endless posts on the fediverse, scrolling fast.

rolle, to fediverse
@rolle@mementomori.social avatar

I would like to endorse other minor web apps in the , but most of them are full of UI glitches, are incomplete and downright buggy looking odd things.

From my designer point of view and are the only effective ones, because they speak to people who are used to proper visual design language (read: Non-nerds, non-engineers, the regular people and design oriented people).

Things like , , and newer niche apps cause reactions like: "What is this?", they look like back end is fine but nobody is in charge of the design and the UI has no direction whatsoever. It's the general culprit in the programming world: A back end developer thinks everything is fine when we add a CSS framework and that's that.

If we just get the UI right everywhere, we get more people to the . I just wish there was more /design people willing to contribute.

SaraSoueidan, to accessibility
@SaraSoueidan@front-end.social avatar

✨ New on the blog:

"A guide to designing accessible, WCAG-conformant focus indicators"

https://sarasoueidan.com/blog/focus-indicators/


Completely rewritten and updated to reflect the most recent changes in WCAG 2.2 criteria.

molly0xfff, to random
@molly0xfff@hachyderm.io avatar

i realize some of you may have thought i was joking when i said one of the things that made me excited about leaving substack was control over how my footnotes and references look

🤩

angelikatyborska, to webdev
@angelikatyborska@mas.to avatar

Based on my experiences in various frontend codebases that were written without a frontend expert on the team (including my own old projects 💩), I compiled a list of 9 most common signs of frontend code quality issues that affect users https://angelika.me/2024/04/13/9-signs-your-frontend-code-has-quality-issues/

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

I wanted to explain fractions to Zoe visually, but all relevant apps targeted older kids and were too complicated for my needs.

Took 15 mins to scratch my itch and prototype this in @CodePen: https://codepen.io/leaverou/pen/yLZdVMZ

Memorable URL / more robust layout version here: https://zoelearns.com/fractions/

The web devs among you may like how this the visualization is entirely drawn in — JS is only used to set two CSS variables :)

Video of the UI showing different fractions and a pie visualization

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

Ooh, just now Firefox has enabled :has() support on Nightly! Should be in tomorrow's build.

https://bugzilla.mozilla.org/show_bug.cgi?id=1853701

matthiasott, to CSS
@matthiasott@mastodon.social avatar
mattwilcox, to webdev
@mattwilcox@mstdn.social avatar

Colour.

1990’s - 2010: pick a colour. Use hex. Done!

2010 - 2023: oh, you can have alpha too. Use rgba. sighs ok, or hsl you art nerd.

2023: buckle up fuck-nut, do you even know what a colour model is? Well then how can you pick the right one for your design requirement then? What’s your gamut? Idiot! Do you even HDR? “Green please?” Simpleton. Get out.

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

The WG resolved to officially work on native custom functions and mixins.

The explainer: https://css.oddbird.net/sasslike/mixins-functions/

The discussion & resolution: https://github.com/w3c/csswg-drafts/issues/9350#issuecomment-1939628591

The spec: (working on it!)

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

🎉 New CSS Project 🎉

It took me a while, but I finally collected all my CSS-only loaders into one place! 🥳

👉 https://css-loaders.com 👈

The Biggest Collection of Loading Animations. More than 500 single-element CSS loaders. Yes, only one element per loader!

Related Article: https://dev.to/afif/css-loaderscom-the-biggest-collection-of-loading-animations-more-than-500--23jg

Pick your favorite one and share it 👇

daviwil, to CSS
@daviwil@fosstodon.org avatar

This site is pretty useful:

https://modernfontstacks.com/

It's a reference for common system-provided fonts for certain styles of text so that you don't need to depend on heavy web font files for your sites but still get nice-looking faces on most systems.

Choose your desired style, copy the font-family line into your CSS, and then you're done!

matthiasott, to webdev
@matthiasott@mastodon.social avatar
amber, to react
@amber@front-end.social avatar

I've been in this industry long enough to see things constantly come & go. #React is no different - it'll be replaced by other frameworks soon & those will be hot for a bit. Then that one will be replaced & so on. Learn your basics! #HTML #CSS, plain #JS. Those are the only things that don't come & go & will take you through your entire career, regardless of what's cool right now. Will I still be coding #WordPress in 10 years? Who knows! But my knowledge of #PHP will carry me on.

westbrook, to CSS
@westbrook@mastodon.social avatar

The is holding some breakout sessions later this month to support digging into Open Styleable Shadow DOM https://github.com/w3c/webcomponents-cg/issues/78 and Declarative Custom Elements/HTML-in-JS/HTML Modules https://github.com/w3c/webcomponents-cg/issues/79. If you're interested in these topics, come share your thoughts on use cases, proposals, and more as we gather developer desires/needs to share with browser implementors in April.

tixie, to CSS
@tixie@guerilla.studio avatar

“CSS is the only language that gets blamed when the author is bad”

https://joshcollinsworth.com/blog/devaluing-frontend

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