Загрузка видео...

Не удалось загрузить видео

На главную

💡 2 CSS tips for textareas: 1️⃣ Use `field-sizing: content` to make the textarea auto-resize to its content 2️⃣ Use `lh` units to set the height in the font's computed line-height units

boltdotnew's profile picture

bolt.new

117,657 subscribers

116,846 просмотров • 1 год назад •via X (Twitter)

Наука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

Design Engineering Tip Consider letting textareas grow with the content instead of introducing nested scrolling. It often creates a smoother writing experience and keeps forms easier to scan. CSS: textarea { field-sizing: content; }
0:14

Design Engineering Tip Consider letting textareas grow with the content instead of introducing nested scrolling. It often creates a smoother writing experience and keeps forms easier to scan. CSS: textarea { field-sizing: content; }

Gabriel

83,413 просмотров • 16 дней назад

extra detail: animate a CSS custom property from 0 to 100 on scroll and use that for a counter() label::after { content: counter(complete) '% complete'; } translate the label using container query units ✨ translate: 0 calc(var(--p) * 1cqh);
0:10

extra detail: animate a CSS custom property from 0 to 100 on scroll and use that for a counter() label::after { content: counter(complete) '% complete'; } translate the label using container query units ✨ translate: 0 calc(var(--p) * 1cqh);

jhey ʕ•ᴥ•ʔ

77,042 просмотров • 1 год назад

gonna start measuring snow height in units of Corgi
0:11

gonna start measuring snow height in units of Corgi

ᴘᴀᴠʟᴏᴠ ᴛʜᴇ ᴄᴏʀɢɪ

1,921,838 просмотров • 3 лет назад

Not uncommon to see checkbox implementations make use of align-items: center which results in some awkward input positioning when the label text wraps. Instead you can make use of baseline which will align nicely across different line-height implementations.
0:16

Not uncommon to see checkbox implementations make use of align-items: center which results in some awkward input positioning when the label text wraps. Instead you can make use of baseline which will align nicely across different line-height implementations.

Alex Carpenter

46,394 просмотров • 1 год назад

one trick behind this demo 👇🎞️ .images { translate: 0 calc(var(--active) * 1lh); } translate a container that holds the images with the line-height unit lean into CSS custom properties and use JavaScript to update the values 🤙
0:18

one trick behind this demo 👇🎞️ .images { translate: 0 calc(var(--active) * 1lh); } translate a container that holds the images with the line-height unit lean into CSS custom properties and use JavaScript to update the values 🤙

jhey ʕ•ᴥ•ʔ

46,527 просмотров • 1 год назад

The reveal, height change, motion blur, selection... Was a joy to build and still a joy to use.
0:12

The reveal, height change, motion blur, selection... Was a joy to build and still a joy to use.

Brotzky

102,882 просмотров • 1 год назад

Use Qwen Code to parse the PDF document into markdown content, and then translate it. Follow us for more AI tips and updates!
0:18

Use Qwen Code to parse the PDF document into markdown content, and then translate it. Follow us for more AI tips and updates!

Alibaba Cloud

86,653 просмотров • 5 месяцев назад

don't know the size of a container in CSS? container query units 🤝 translate a:hover .corner:nth-of-type(odd) { translate: 100cqi 0; } /* hover intent */ a:hover .corner { transition: translate 0.26s 0.12s; } adapts to content size 👇
0:16

don't know the size of a container in CSS? container query units 🤝 translate a:hover .corner:nth-of-type(odd) { translate: 100cqi 0; } /* hover intent */ a:hover .corner { transition: translate 0.26s 0.12s; } adapts to content size 👇

jhey ʕ•ᴥ•ʔ

65,006 просмотров • 1 год назад

We're transitioning into the height of Summer ☀️ Here's some tips on how to get the most out of the season in #AssassinsCreedShadows. 🎨 Paint the legendary White Tanuki (only available in Summer). 🌊 Use bodies of water like ponds as camouflage. 🌿 More foliage to keep hidden.
0:19

We're transitioning into the height of Summer ☀️ Here's some tips on how to get the most out of the season in #AssassinsCreedShadows. 🎨 Paint the legendary White Tanuki (only available in Summer). 🌊 Use bodies of water like ponds as camouflage. 🌿 More foliage to keep hidden.

Assassin's Creed

34,666 просмотров • 10 месяцев назад

✍️ New Article: Better fluid sizing with round() I wrote about how CSS round() enhances the values you get from clamp() in sizing, typography, and spacing. Why it matters, and how to use it. 🔗
0:17

✍️ New Article: Better fluid sizing with round() I wrote about how CSS round() enhances the values you get from clamp() in sizing, typography, and spacing. Why it matters, and how to use it. 🔗

Ahmad Shadeed

29,835 просмотров • 1 месяц назад

¡POR FIN podremos hacer esto con CSS! Cambiar el tamaño de un textarea según su contenido. Es la nueva propiedad "form-sizing: content". Aquí te dejo una demostración:
0:14

¡POR FIN podremos hacer esto con CSS! Cambiar el tamaño de un textarea según su contenido. Es la nueva propiedad "form-sizing: content". Aquí te dejo una demostración:

Miguel Ángel Durán

174,701 просмотров • 2 лет назад

Only a few days left to enter in the Pixels Creator Contest. 1️⃣ Create content announcing Pixels coming to Ronin 🙌🏼 2️⃣ Reply to the original post below with your content 3️⃣ Submit the link to the "Pixels Creator Contest" quest on Moku HQ
0:15

Only a few days left to enter in the Pixels Creator Contest. 1️⃣ Create content announcing Pixels coming to Ronin 🙌🏼 2️⃣ Reply to the original post below with your content 3️⃣ Submit the link to the "Pixels Creator Contest" quest on Moku HQ

Moku✨

41,652 просмотров • 2 лет назад

"Someone should learn the correct use of height from this baboon!"
0:15

"Someone should learn the correct use of height from this baboon!"

Nature Chapter

1,143,767 просмотров • 4 месяцев назад

CSS shape() is now Baseline Newly Available → The shape() function allows you to create responsive, complex paths for layouts and animations using standard CSS units like %, rem, and calc().
0:11

CSS shape() is now Baseline Newly Available → The shape() function allows you to create responsive, complex paths for layouts and animations using standard CSS units like %, rem, and calc().

Chrome for Developers

24,796 просмотров • 2 месяцев назад

cliff 🪨 - make stepped planes with sop - use them for height map with triplanar #houdini
0:18

cliff 🪨 - make stepped planes with sop - use them for height map with triplanar #houdini

tinybugbot

19,576 просмотров • 1 год назад

‼️NEW FREE UNITS EVENT REVEALED Head to Cyclops on the new Krakoa social hub map and claim daily units for 7 days in a row, up to 300 units per day. Also, invite friends to the 'Tandem Tides' event to unlock limited-time rewards
0:12

‼️NEW FREE UNITS EVENT REVEALED Head to Cyclops on the new Krakoa social hub map and claim daily units for 7 days in a row, up to 300 units per day. Also, invite friends to the 'Tandem Tides' event to unlock limited-time rewards

Marvel Rivals Intel

200,218 просмотров • 5 часов назад

The Colossus of Constantine, reconstructed in its full 12-metre height, soon to go on display at the Capitoline Museums in Rome.
0:19

The Colossus of Constantine, reconstructed in its full 12-metre height, soon to go on display at the Capitoline Museums in Rome.

Wanted in Rome

523,806 просмотров • 2 лет назад

The ultimate group hug. Sperm whales are incredibly social creatures that use touch and 'codas' (clicking sounds) to bond with their family units.
0:16

The ultimate group hug. Sperm whales are incredibly social creatures that use touch and 'codas' (clicking sounds) to bond with their family units.

Oceaiii🐋🐬

11,859 просмотров • 3 месяцев назад