Artwork

Cursief에서 제공하는 콘텐츠입니다. 에피소드, 그래픽, 팟캐스트 설명을 포함한 모든 팟캐스트 콘텐츠는 Cursief 또는 해당 팟캐스트 플랫폼 파트너가 직접 업로드하고 제공합니다. 누군가가 귀하의 허락 없이 귀하의 저작물을 사용하고 있다고 생각되는 경우 여기에 설명된 절차를 따르실 수 있습니다 https://ko.player.fm/legal.
Player FM -팟 캐스트 앱
Player FM 앱으로 오프라인으로 전환하세요!

S4E3: New CSS features that got us excited

54:34
 
공유
 

Manage episode 409897203 series 3080445
Cursief에서 제공하는 콘텐츠입니다. 에피소드, 그래픽, 팟캐스트 설명을 포함한 모든 팟캐스트 콘텐츠는 Cursief 또는 해당 팟캐스트 플랫폼 파트너가 직접 업로드하고 제공합니다. 누군가가 귀하의 허락 없이 귀하의 저작물을 사용하고 있다고 생각되는 경우 여기에 설명된 절차를 따르실 수 있습니다 https://ko.player.fm/legal.

Missing the old style of podcast episodes where we ramble a bunch about technical stuff? Well, here's another!

We talk about some of the new CSS features that were standardized in 2023. These features can be a big help in your everyday CSS writing!

  1. Container queries: what are they and how are they different than regular media queries?
  2. New viewport units: s- d- l- prefixes for your vw or vh units. How do these differ from our regular vw and vh units? Also, no more jumping interfaces when scrolling on mobile!?
  3. Nesting in native CSS!? What does the syntax look like? Is SCSS now obsolete? (no, no it's not)
  4. Gap property for flexbox: a small change that prevents a lot of annoying side effects of having margin or padding for spacing child elements.
  5. Individual transform properties! No more "transform: translateX(50%) rotate(30deg) scale(1.2);" but now each property gets its own name, like: "translate: 50% 0; rotate: 30deg; scale: 1.2;". What does this mean for transitions? Are there any gotchas?
  6. The new ":has()" selector is here! What does it do and is it true you can select the parent of an element?

All this and more in this old school episode of ECC!

Referenced blog (it's incomplete tho): https://positivethinking.tech/insights/the-10-new-css-features-in-2023/

  continue reading

82 에피소드

Artwork
icon공유
 
Manage episode 409897203 series 3080445
Cursief에서 제공하는 콘텐츠입니다. 에피소드, 그래픽, 팟캐스트 설명을 포함한 모든 팟캐스트 콘텐츠는 Cursief 또는 해당 팟캐스트 플랫폼 파트너가 직접 업로드하고 제공합니다. 누군가가 귀하의 허락 없이 귀하의 저작물을 사용하고 있다고 생각되는 경우 여기에 설명된 절차를 따르실 수 있습니다 https://ko.player.fm/legal.

Missing the old style of podcast episodes where we ramble a bunch about technical stuff? Well, here's another!

We talk about some of the new CSS features that were standardized in 2023. These features can be a big help in your everyday CSS writing!

  1. Container queries: what are they and how are they different than regular media queries?
  2. New viewport units: s- d- l- prefixes for your vw or vh units. How do these differ from our regular vw and vh units? Also, no more jumping interfaces when scrolling on mobile!?
  3. Nesting in native CSS!? What does the syntax look like? Is SCSS now obsolete? (no, no it's not)
  4. Gap property for flexbox: a small change that prevents a lot of annoying side effects of having margin or padding for spacing child elements.
  5. Individual transform properties! No more "transform: translateX(50%) rotate(30deg) scale(1.2);" but now each property gets its own name, like: "translate: 50% 0; rotate: 30deg; scale: 1.2;". What does this mean for transitions? Are there any gotchas?
  6. The new ":has()" selector is here! What does it do and is it true you can select the parent of an element?

All this and more in this old school episode of ECC!

Referenced blog (it's incomplete tho): https://positivethinking.tech/insights/the-10-new-css-features-in-2023/

  continue reading

82 에피소드

ทุกตอน

×
 
Loading …

플레이어 FM에 오신것을 환영합니다!

플레이어 FM은 웹에서 고품질 팟캐스트를 검색하여 지금 바로 즐길 수 있도록 합니다. 최고의 팟캐스트 앱이며 Android, iPhone 및 웹에서도 작동합니다. 장치 간 구독 동기화를 위해 가입하세요.

 

빠른 참조 가이드

탐색하는 동안 이 프로그램을 들어보세요.
재생