CSSBootcamp's profile picture. 👋 Just getting started. Video content ready Aug/Sept 2021. Signup for our newsletter for discounts on early access 😎

CSSBootcamp

@CSSBootcamp

👋 Just getting started. Video content ready Aug/Sept 2021. Signup for our newsletter for discounts on early access 😎

Pinned

⛵️We are officially launched! Go to CSSBootcamp.com to checkout our new home page and two fresh courses available today. 👉🏻 Please retweet for reach


CSSBootcamp reposted

⛵️We are officially launched! Go to CSSBootcamp.com to checkout our new home page and two fresh courses available today. 👉🏻 Please retweet for reach


CSSBootcamp reposted

You can use `aspect-ratio` now in CSS to get that perfect width to height ratio. Then when you set a width or the width is determined by a container, the height is adjusted automatically. It works just about everywhere caniuse.com/mdn-css_proper…

CSSBootcamp's tweet image. You can use `aspect-ratio` now in CSS to get that perfect width to height ratio. Then when you set a width or the width is determined by a container, the height is adjusted automatically.

It works just about everywhere caniuse.com/mdn-css_proper…

CSS Trick: If you have a block element with an unknown width (width is as wide as its contents), you can give it a width of `fit-content` and then the old `margin: 0 auto` trick will work:

CSSBootcamp's tweet image. CSS Trick: If you have a block element with an unknown width (width is as wide as its contents), you can give it a width of `fit-content` and then the old `margin: 0 auto` trick will work:

CSSBootcamp reposted

It blows my mind how frequently I get asked (basic) CSS questions from people who have been developing software for years ... I'm gonna start adding on a link to Brads course now so they can learn to fish for themselves 😂)

👋We're almost done with the second course which means it's almost time for our launch! We plan for next week or the week after. Newsletter ppl will be first to know cssbootcamp.com #1: Absolute Beginner 🟩🟩🟩🟩🟩🟩🟩🟩🟩🟩 #2: CSS Core Essentials 🟩🟩🟩🟩🟩🟩🟩🟩🟩⬜️



👋We're almost done with the second course which means it's almost time for our launch! We plan for next week or the week after. Newsletter ppl will be first to know cssbootcamp.com #1: Absolute Beginner 🟩🟩🟩🟩🟩🟩🟩🟩🟩🟩 #2: CSS Core Essentials 🟩🟩🟩🟩🟩🟩🟩🟩🟩⬜️


Container Queries Are Amazing 😍

Responsive card > Responsive button > Responsive icon Container queries are the future y'all. SO dope to work with. Demo requires Canary + Container Queries flag Uses: - Newer `container: inline-size` syntax - Named containers to query diff parents codepen.io/una/pen/NWgxXGV



CSSBootcamp reposted

🚨 Add a custom color to your forms in 1 line of CSS: INTRODUCING the accent-color property!! `accent-color: pink`= pink checkboxes, radio buttons, sliders, etc. Landing in: Chromium 93 (Aug 31) Firefox 92 (Sept 7) Read: web.dev/accent-color/ Try it: accent-color.glitch.me

Una's tweet image. 🚨 Add a custom color to your forms in 1 line of CSS: INTRODUCING the accent-color property!!

`accent-color: pink`= pink checkboxes, radio buttons, sliders, etc.

Landing in:
Chromium 93 (Aug 31)
Firefox 92 (Sept 7)

Read:
web.dev/accent-color/

Try it:
accent-color.glitch.me
Una's tweet image. 🚨 Add a custom color to your forms in 1 line of CSS: INTRODUCING the accent-color property!!

`accent-color: pink`= pink checkboxes, radio buttons, sliders, etc.

Landing in:
Chromium 93 (Aug 31)
Firefox 92 (Sept 7)

Read:
web.dev/accent-color/

Try it:
accent-color.glitch.me

This is technically the first thing launched from cssbootcamp.com. More helpful tools to come and courses are still scheduled to be ready August/Sep sometime

✨ CSS Specificity Calculator 0️⃣1️⃣ 1️⃣ Remember that long selectors can lead to more specificity which is difficult to override later if you need to cssbootcamp.com/css/specificit…



CSSBootcamp reposted

Ever frustrated by the fact that ✅ only has a green counter part (❎) but not a red one? CSS `filter: hue-rotate(-120deg)` can help!

DasSurma's tweet image. Ever frustrated by the fact that ✅ only has a green counter part (❎) but not a red one?

CSS `filter: hue-rotate(-120deg)` can help!
DasSurma's tweet image. Ever frustrated by the fact that ✅ only has a green counter part (❎) but not a red one?

CSS `filter: hue-rotate(-120deg)` can help!

CSSBootcamp reposted

Layoutit Grid is a nice free CSS Grid interface builder: grid.layoutit.com. Exports to CodePen or CodeSandbox with other handy features like auto-placement bit.ly/layoutit2

addyosmani's tweet image. Layoutit Grid is a nice free CSS Grid interface builder: grid.layoutit.com. Exports to CodePen or CodeSandbox with other handy features like auto-placement bit.ly/layoutit2

🎉 Things are going great over here with CSSBootcamp.com. More video content will be recorded tonight. Lots of great features are coming together. Here's a little sneak preview of the UI

CSSBootcamp's tweet image. 🎉 Things are going great over here with CSSBootcamp.com. More video content will be recorded tonight. Lots of great features are coming together. Here's a little sneak preview of the UI

CSSBootcamp reposted

✨ What's new in DevTools (Chrome 93)? ✨ 📝 Editable CSS container queries 📦 Preview web bundle request 🐞 Improved CORS debugging And more! Try in Chrome Canary today. Full list of new features 👉🏼 developer.chrome.com/blog/new-in-de…

ChromeDevTools's tweet image. ✨ What's new in DevTools (Chrome 93)? ✨

📝 Editable CSS container queries
📦 Preview web bundle request
🐞 Improved CORS debugging

And more! Try in Chrome Canary today.

Full list of new features 👉🏼 developer.chrome.com/blog/new-in-de…

Have you tried the <picture> element? What's stopping you from learning it and trying it? developer.mozilla.org/en-US/docs/Web…


CSSBootcamp reposted

Are you looking to learn CSS much better than you know it now? I'm making cssbootcamp.com and just had a chance to show it to a few friends (I think they're the first to see it besides @chancethedev). 🎉 Signup for the newsletter to get early access once it's ready soon


Loading...

Something went wrong.


Something went wrong.