Front-End Front (@frontendfront) header
Front-End Front (@frontendfront) profile picture

Front-End Front

@frontendfront

A crowd curated feed of front-end related articles. There's also an updated list of upcoming JS conferences, if you're interested in that.

 The Interwebs
frontendfront.com
Joined November 2014
  • Tweets3.6K
  • Following55
  • Followers8.1K
287Media
Photo by Front-End Front (@frontendfront)Photo by Front-End Front (@frontendfront)Photo by Front-End Front (@frontendfront)Photo by Front-End Front (@frontendfront)Photo by Front-End Front (@frontendfront)Photo by Front-End Front (@frontendfront)
Sincerely hope to see you at Devs For Ukraine, a free conference to help Ukraine, with a wonderful line-up of speakers. What a wonderful initiative by the community! 💙💛 About the conference ↓ devsforukraine.io
1
12
21
We All Are Ukraine 🇺🇦 and today Ukraine needs our help. smashingmagazine.com/2022/02… We donate all proceeds from our "Interface Design Checklists" PDF to support Ukraine. The article also lists other ways you can help. 🇺🇦❤️
We All Are Ukraine 🇺🇦 — Smashing Magazine

We All Are Ukraine 🇺🇦 — Smashing Magazine

As a design community, we all can’t be silent in these times. We need to be united in our fight against the war, for democracy, for those dreams that children are entitled to have when they are...

smashingmagazine.com
9
58
3
153
We know y'all check your work in multiple browsers to make sure your website doesn't break for people. We'll help you a bit in @firefox 98, adding a new Compatibility panel. It will report possible CSS issues on your page ⚠️, using @MozDevNet data under the hood
The new Firefox DevTools Compatibility panel in the inspector. A "selected element" group has a "scrollbar-color" item. On the right, Chrome, Safari, Edge and Internet Explorer icons are displayed. A tooltip is displayed with the following message: "Compatibility issues in: Chrome 97 (current)\nChrome 98 (beta)\nChrome 99 (nightly)\nChrome Android 97 (current)" and so on, with all the browsers not supporting scrollbar-color

ALT The new Firefox DevTools Compatibility panel in the inspector. A "selected element" group has a "scrollbar-color" item. On the right, Chrome, Safari, Edge and Internet Explorer icons are displayed. A tooltip is displayed with the following message: "Compatibility issues in: Chrome 97 (current)\nChrome 98 (beta)\nChrome 99 (nightly)\nChrome Android 97 (current)" and so on, with all the browsers not supporting scrollbar-color

25
470
88
2,148
Front-End Front retweeted
Bramus (@bramus) profile picture
Bramus@bramus21 Dec 2021
💡 Late night CSS :has() use-case epiphany: forms.
/* A <label> that wraps an <input />, often seen with checkboxes and radios */ label:has(> input) { … } /* A <label> that's directly followed by an <input /> */ label:has(+ input) { … }

ALT /* A <label> that wraps an <input />, often seen with checkboxes and radios */ label:has(> input) { … } /* A <label> that's directly followed by an <input /> */ label:has(+ input) { … }

8
103
6
719
Front-End Front retweeted
Chris Coyier (@chriscoyier) profile picture
Chris Coyier
@chriscoyier21 Dec 2021
Real-life stuff in here. There is @ericwbailey's "Test Your Product on a Crappy Laptop" css-tricks.com/test-your-pro… Guess what?... I'm home for the holidays helping my folks with computer stuff, and I can't even manage to download Dropbox. The app itself works, the site does not.
Image from Chris Coyier (@chriscoyier)
4
28
Front-End Front retweeted
Yudhi Satrio 🍉 (@iSatrio) profile picture
Yudhi Satrio 🍉@iSatrio16 Dec 2021
Dear, front end, please learn basic CSS (at least). This is why if you're not learning it.
Image from Yudhi Satrio 🍉 (@iSatrio)
53
64
44
375
Front-End Front retweeted
Jen Simmons (@jensimmons) profile picture
Jen Simmons@jensimmons29 Nov 2021
Need some good news among all the bad? Do you write CSS? Use Flexbox? Hi. Safari supports the `gap` property for Flexbox. Has since Safari 14.1. Released April 25, 2021.
Image from Jen Simmons (@jensimmons)
12
39
11
397
Front-End Front retweeted
Benjamin De Cock (@bdc) profile picture
Benjamin De Cock
@bdc1 Nov 2021
I vividly remember being unreasonably excited at the CSS Working Group meeting when we finally agreed on this: teapawt.net/bdc/status/11009212588… But I'm *even more* excited now to see Safari Tech Preview actually shipping those new constants, trigonometric and exponential functions!
Image from Benjamin De Cock (@bdc)
Benjamin De Cock (@bdc) profile pictureBenjamin De Cock
@bdc28 Feb 2019
The CSS Working Group agreed this morning on adding many math functions. We now have: • calc() • min() • max() • clamp() • sin() • cos() • tan() • acos() • asin() • atan() • atan2() • hypot() • sqrt() • pow() The face of CSS is rapidly changing.
1
8
87
Front-End Front retweeted
Umair Hafeez (@_UmairHafeez_) profile picture
Umair Hafeez@_UmairHafeez_7 Sep 2021
A short tutorial to understand z-index in CSS 👇
223
2,717
470
12,046
Clever! Love this #CSS tip 👇🏻
ʞʎɐɥ (@hihayk) profile pictureʞʎɐɥ@hihayk8 Jul 2020
CSS trick to dynamically reduce the line-height as the font-size grows, large texts need condensed line-height
Image from ʞʎɐɥ (@hihayk)
3
39
296
Front-End Front retweeted
Jina Anne (@jina) profile picture
Jina Anne
@jina29 Jul 2021
CSS is amazing. I am sad that it seems so undervalued at times. Many of the most senior programmers I know can't grasp it. If you can, know that you are amazing. And there are jobs for you. Try design systems. It welcomes you! 💜💜💜
You’re unable to view this Post because this account owner limits who can view their Posts. Learn more
6
20
1
244
HTML Tip 💡 Use the <mark> tag to highlight text. No CSS is needed and it's fully supported by all major browsers 🔥 Result in the comments👇
Image from Mari Simon coding 👩🏽‍💻 (@simonpaix)
26
77
4
533
Front-End Front retweeted
Jen Simmons (@jensimmons) profile picture
Jen Simmons@jensimmons15 Jul 2021
JavaScript, HTML, CSS, Flash
Image from Jen Simmons (@jensimmons)
37
217
23
1,638
Front-End Front retweeted
Nathalie Lawhead (@alienmelon) profile picture
Nathalie Lawhead@alienmelon12 Jul 2021
i've been making this small flexible javascript thing that lets you animated the CSS cursor property to support setting the cursor to any animation (any length of frames, any element, as many as u like...). with it you can make a cursor theme for your websites! (coming soon)
2
19
1
121
Front-End Front retweeted
Cassie Evans (@cassiecodes) profile picture
Cassie Evans@cassiecodes8 Jul 2021
🥳 Exciting update I'm throwing my SVG workshop again this September with the lovely @pland_online crew. If you have any questions, my DM's are open or you can email [email protected] I hope to see you there! cassie.codes/speaking/gettin…
8
44
11
221
Front-End Front retweeted
Josh Pigford (@Shpigford) profile picture
Josh Pigford
@Shpigford17 Jun 2021
Hiring a frontend engineer who's really great at HTML + CSS is surprisingly difficult.
130
156
71
1,740
I've revolutionized CSS.
Image from sam "zero​width​space" thor (@samthor)
88
303
122
2,238
Front-End Front retweeted
Elad Shechter (@eladsc) profile picture
Elad Shechter@eladsc6 Jun 2021
#CSS Positions got the 'inset' property, a shorthand to describe all the directions combined. Now has full support in all the updatable browsers.
Image from Elad Shechter (@eladsc)
28
789
83
3,781
Front-End Front retweeted
Maximiliano Firtman (@firt) profile picture
Maximiliano Firtman
@firt7 Jun 2021
On iOS 15, bottom fixed elements will have problems if CSS safe area environment variables (env function) are not used; look at the Starbucks "Start an order" button with a) URL bar hidden b) URL bar visible (current code) c) URL bar visible visible with env margin
Image from Maximiliano Firtman (@firt)
Image from Maximiliano Firtman (@firt)
Image from Maximiliano Firtman (@firt)
11
75
20
161
Front-End Front retweeted
ppk.css 🇪🇺 (@ppk) profile picture
ppk.css 🇪🇺@ppk22 Apr 2021
I started up a new service: CSS coaching. I would like to help people who need to take their next step in understanding and working with CSS. quirksmode.org/css-coaching.… Interested? Let me know. RTs appreciated.

CSS Coaching - ppk

Do you need a CSS coach? Is there too much CSS for you? Unable to take decisions? Need to upgrade your knowledge level? Or do you just need help getting unstuck? Or talk about CSS beyond what you...

quirksmode.org
12
6
Load more