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

Beware of dragons at the spicy edges of modern #CSS.

Familiarize yourself with "invalid at computed value time" and make use of support queries!

If using partially supported features, mix with caution and don't slip on browser testing or assume your browserslist-reliant tooling is sufficient.

teodorsandu, to Funny
@teodorsandu@mastodon.online avatar
christian, to 11ty
@christian@aldr.social avatar

I'm taking a bit more time with my starter kit upgrade.

Along with moving away from SASS/SCSS, I have decided to learn and lean into the CUBE CSS methodology once and for all 💪

I keep seeing it pop up from developers I admire and now would be a perfect time to give it a spin.

Not sure if I'll also delve into design tokens just yet 👀 but maybe.

https://cube.fyi/

christian,
@christian@aldr.social avatar

Also this: https://every-layout.dev/

Lots of learning to do 📖

khalidabuhakmeh, to CSS
@khalidabuhakmeh@mastodon.social avatar

I hard-coded in a style attribute, and I’m not even sorry about it.

iamdtms, to CSS
@iamdtms@mas.to avatar

cory, (edited ) to webdev
@cory@social.lol avatar

🔗: Old Dogs, new CSS Tricks via Max Böck https://mxb.dev/blog/old-dogs-new-css-tricks/

dulvui, to CSS
@dulvui@mastodon.social avatar

If you ever wondered how to force clear the browser's cache of your css:
style_1.0.css
style_1.1.css
style_1.2.css
...

Simple but effective.

mobileatom, to CSS
@mobileatom@flipboard.com avatar

Old Dogs, new CSS Tricks. #CSS

https://mxb.dev/blog/old-dogs-new-css-tricks/?utm_source=flipboard&utm_medium=activitypub

Posted into Responsive Design, UX, UI, and more @responsive

davidbisset, to CSS
@davidbisset@phpc.social avatar

Why new features aren't getting fast adoption as one might think.

https://mxb.dev/blog/old-dogs-new-css-tricks/

"While there are many different reasons for the slow adoption, I think one of the biggest barriers are our own brains."

Natanox, to webdev
@Natanox@chaos.social avatar

I probably get flooded by asking this but welp, here I go:

I'm looking for a good, visual (!) for that focuses on Codium, Firefox and other Open-Source tools. My specific interests are to learn , , and . Perhaps some minor , however I'd like to primarily work without it.

I'm a visual learner, extended theory in text won't help me at all. As language is visual to me, so is .

Anyone knows something that checks these boxes?

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

🎮 New CSS Game!

What about a CSS game that you can play with your keyboard? No, it's not a joke but a reality!

Play "Super CSS Mario", the first ever CSS-Only game playable using your keyboard. Have fun! 🤩

✅ 0% JavaScript
✅ 100% CSS Magic

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

Record yourself and show me your best attempt (No screenshots & no cheating 😈)

It's a Chrome (or Edge) only. I repeat, it's a Chrome-only experience.

Showing a demo of the CSS-only game linked in the post. A cool Mario game where you can collect gold coins using Keyboard.

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

A quick post addressing some questions about masonry and reading order https://rachelandrew.co.uk/archives/2024/05/26/masonry-and-reading-order/ #css

j9t, (edited ) to webdev
@j9t@mas.to avatar

I’m planning and preparing a new book, about rote learning HTML and CSS. (Will add the draft cover!)

Double question!

  1. Is “rote learning” clear?

  2. Would you be interested in such a book?

eric, to random
@eric@social.ericwbailey.website avatar
stvfrnzl,
@stvfrnzl@mastodon.online avatar

@eric @Wilto this looks so cool!

I've been thinking for a while now to have my website look more like a noir comic instead of a standard website.

Should be way more fun and a great exercise

css, to ai
@css@front-end.social avatar
johnnydecimal, to CSS
@johnnydecimal@hachyderm.io avatar

Any #CSS gurus want to help me solve a puzzle? Maybe @robb? Honestly I don't know where to start.

The 'Location' box at the top of my page works great. Except on landscape mobile, where the corners are all janky as the lines don't line up: see screenshot.

But if I take my desktop browser, pop it in responsive mode, and shrink the window: it's A-OK!

WTF?

A screenshot of Safari in responsive mode. The window is 591px wide and the lines look great!

SenseException, to CSS German
@SenseException@phpc.social avatar

#CSS communication tipp: It's important to know why !important was important

helma, to security
@helma@mastodon.social avatar

"Going Dark: The war on encryption is on the rise. Through a shady collaboration between the US and the EU."

#Security #Privacy #CSAM #CSS

https://mullvad.net/en/why-privacy-matters/going-dark

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

Thanks to everyone who joined us for our first ever Winging It Live stream last week! We had so much fun with you all that we're planning another one on May 30 @ 1pm ET / 11am MT.

Miriam (@mia) and James (@Jamessw) are going to discuss Anchor Positioning. Leave your questions in the comments. We'll post the link to the live stream here next week. Or you can subscribe to get updates.

#css https://www.youtube.com/@wingingitoddbird

noellemitchell, to Kurzgesagt
@noellemitchell@mstdn.social avatar

Why would I work on when I can look at interesting posts on instead? :blobcatlaugh: :blobcatcode:

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

I'm teaching a new layout workshop at the end of June – a three-session deep-dive into…

  • box alignment!
  • intrinsic & extrinsic sizing
  • when to use flexbox vs grid
  • media & container queries
  • layout contexts & 'normal' flow
  • and so much more…

Sign up now!

https://www.oddbird.net/workshops/cascading-layouts/

cirrus, to webdev
@cirrus@mstdn.social avatar

Started writing a decision log for our . Documenting why we chose to build plain ol' and where we can and where client-side is needed is turning into a bit of a manifesto. Essentially we're using (and encouraging others to use) 😉

davidbisset, to CSS
@davidbisset@phpc.social avatar

matcha.css is a "drop-in semantic styling library in pure ".

https://matcha.mizu.sh/

Designed to style elements similarly to a default browser stylesheet, eliminating the need for users to manually patch their documents.

Ideal for fast prototyping, static HTML pages, generated documents, etc.

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

Hey my #JSHeroes2024 friends (and beyond)! I have published the slides of my talk “MPA View Transitions are here!” on my blog for you to check out.

Once the video gets published, I'll be sure to update the post to include it.

https://www.bram.us/2024/05/23/mpa-view-transitions-are-here-2024-05-23-jsheroes/

#CSS #ViewTransitions #JSHeroes

Me, on stage
Me on stage, from afar

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