Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

This is going to make fluid + responsive typography so much better! CSS text-wrap: balance; will evenly distribute your text on available lines.

wesbos's profile picture

Wes Bos

435,544 subscribers

92,293 görüntüleme • 3 yıl önce •via X (Twitter)

EğitimSanatBilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

11 Yorum

Yann 🎈 profil fotoğrafı
Yann 🎈3 yıl önce

This will make react-wrap-balancer unnecessary 😁

TJ Rivas profil fotoğrafı
TJ Rivas3 yıl önce

This is an absolute game changer honestly.

Andy profil fotoğrafı
Andy3 yıl önce

The number of times I’ve wanted this…

Iryna Kreichmann 🇺🇦 👩‍💻 profil fotoğrafı
Iryna Kreichmann 🇺🇦 👩‍💻3 yıl önce

What software do you use to make videos like that? I mean showing yourself and showing code and screen above? 😃

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

It’s screenflow. I have a video on YouTube on how I do it

Marcel Tams profil fotoğrafı
Marcel Tams3 yıl önce

There's the vid. Phenomenal speed.

🧗‍♂️ Matt Holt profil fotoğrafı
🧗‍♂️ Matt Holt3 yıl önce

I LOVE THIS

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

You are gonna freak when you hear you need 500mb just to run <h1 style="text-wrap:balance;>Hello World</h1>

Mike @ HTML All The Things 🎙️ profil fotoğrafı
Mike @ HTML All The Things 🎙️3 yıl önce

Holy shit, I need this now 😭

Derek Cavaliero profil fotoğrafı
Derek Cavaliero3 yıl önce

How do you enable this to work in Chrome?

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

It's in Chrome Canary - no flags needed as far as I can tell

Benzer Videolar

Did you know about the CSS property 'text-wrap: balance'? It balances text distribution when wrapping, creating a harmonious layout. Now it's so easy to control the text 😎
0:20

Did you know about the CSS property 'text-wrap: balance'? It balances text distribution when wrapping, creating a harmonious layout. Now it's so easy to control the text 😎

Viki ✨

16,549 görüntüleme • 2 yıl önce

Achieve balanced text layouts in CSS with text-wrap: balance; This feature offers a more effective way to control text wrapping for improved readability and a more polished look. See examples and learn more →
0:58

Achieve balanced text layouts in CSS with text-wrap: balance; This feature offers a more effective way to control text wrapping for improved readability and a more polished look. See examples and learn more →

Chrome for Developers

20,593 görüntüleme • 1 yıl önce

What’s old is new again 🌀 Learn how to create fluid, responsive scroll-driven animations that give your users engaging, app-like web experiences—with only a few lines of CSS. 🔗
0:48

What’s old is new again 🌀 Learn how to create fluid, responsive scroll-driven animations that give your users engaging, app-like web experiences—with only a few lines of CSS. 🔗

Chrome for Developers

6,844,437 görüntüleme • 1 yıl önce

Don't use ChatGPT to just summarise text - It can do so much more! This mindblowing prompt will turn your text into a DIAGRAM! Here's a tutorial how to do it for FREE: (It even works inside your Obsidian notes) 👇
0:55

Don't use ChatGPT to just summarise text - It can do so much more! This mindblowing prompt will turn your text into a DIAGRAM! Here's a tutorial how to do it for FREE: (It even works inside your Obsidian notes) 👇

Ilya Shabanov

192,082 görüntüleme • 3 yıl önce

How to humanize AI written text in seconds? 1. Go to 2. Copy and paste your text or upload the file 3. HumanizeThis will humanize your text in seconds 4. After this, it will check it through 8 AI detectors - TurnItIn - GPTZero - Originality AI - CopyLeaks, and so on 5. These detectors confirm the text is humanized 6. You can also see the changes tracked 7. Accept the changes and copy the humanized text The best part? It is FREE Humanizethis Link:
0:30

How to humanize AI written text in seconds? 1. Go to 2. Copy and paste your text or upload the file 3. HumanizeThis will humanize your text in seconds 4. After this, it will check it through 8 AI detectors - TurnItIn - GPTZero - Originality AI - CopyLeaks, and so on 5. These detectors confirm the text is humanized 6. You can also see the changes tracked 7. Accept the changes and copy the humanized text The best part? It is FREE Humanizethis Link:

Faheem Ullah

120,426 görüntüleme • 5 ay önce

Can we please stop with the scroll-jacking carousels on websites? CSS Scroll Snap is a much better solution! Re-built the Uniqlo home page with 6 lines of CSS and 4 lines of JS
2:35

Sensitive content

Can we please stop with the scroll-jacking carousels on websites? CSS Scroll Snap is a much better solution! Re-built the Uniqlo home page with 6 lines of CSS and 4 lines of JS

Wes Bos

305,384 görüntüleme • 1 yıl önce

Tf is going on with the text to speech?😭
1:08

Tf is going on with the text to speech?😭

Nightskin™

14,983 görüntüleme • 6 ay önce

This is your sign to text “SIGNS” to 27390
0:30

This is your sign to text “SIGNS” to 27390

Luke Bryan

19,001 görüntüleme • 4 ay önce

Got inspired by Resend's keyboard component, made something similar using pure CSS. This way, its configurable during runtime, so you can change the text and colour to your liking.
0:30

Got inspired by Resend's keyboard component, made something similar using pure CSS. This way, its configurable during runtime, so you can change the text and colour to your liking.

balint

185,581 görüntüleme • 1 yıl önce

Now available in your Figma Make workflows: → Voice-to-text prompts → Version History → Question Cards → Clear Context
1:25

Now available in your Figma Make workflows: → Voice-to-text prompts → Version History → Question Cards → Clear Context

Figma

36,595 görüntüleme • 4 ay önce

This is going to make your life much easier!!
0:36

This is going to make your life much easier!!

ᴋɪᴛᴄʜᴇɴ ʀᴇᴄɪᴘᴇꜱ👩‍🍳

694,259 görüntüleme • 9 ay önce

Happy to say that we've (Oxide Computer Company) raised $100M for our Series B ... which was a wonderful excuse to work on this little featured blog header ASCII element. With text trimming, responsive text sizing and funky SDF coins
0:23

Happy to say that we've (Oxide Computer Company) raised $100M for our Series B ... which was a wonderful excuse to work on this little featured blog header ASCII element. With text trimming, responsive text sizing and funky SDF coins

Ben Leonard

24,348 görüntüleme • 1 yıl önce

This would make so much more sense with matcha, Labubus and pink sparkly text, said no one ever. ✨ 😇 Catch all Macau sessions on @MotorsportTV_UK.
0:23

This would make so much more sense with matcha, Labubus and pink sparkly text, said no one ever. ✨ 😇 Catch all Macau sessions on @MotorsportTV_UK.

Motorsport

394,949 görüntüleme • 9 ay önce

Will Horcoff is going to make SO much money in the NHL 💰
1:18

Will Horcoff is going to make SO much money in the NHL 💰

Spittin' Chiclets

66,002 görüntüleme • 9 ay önce

Your app talks back. Lovable now supports text-to-speech and-speech-to-text, so you can seamlessly add AI voice features to your projects. Make a voice assistant, a hands-free tool, or an app you can literally speak to. Sound on:
0:31

Your app talks back. Lovable now supports text-to-speech and-speech-to-text, so you can seamlessly add AI voice features to your projects. Make a voice assistant, a hands-free tool, or an app you can literally speak to. Sound on:

Lovable

22,385 görüntüleme • 2 ay önce

Someone on reddit posted a demo where CSS truncates text from the middle. They didn't post the code, so here is my shot at it with Flexbox
1:39

Someone on reddit posted a demo where CSS truncates text from the middle. They didn't post the code, so here is my shot at it with Flexbox

Wes Bos

104,152 görüntüleme • 6 ay önce

This text behind subject effect in Canva is the easiest way to make your designs look instantly aesthetic and elevated.
0:47

This text behind subject effect in Canva is the easiest way to make your designs look instantly aesthetic and elevated.

𝒞𝓊𝒹𝒹𝓁𝑒 𝒞𝒽𝓇𝑜𝓃𝒾𝒸𝓁𝑒𝓈

69,253 görüntüleme • 3 ay önce

I've got times available tomorrow!!!! Come get a fresh cut and titts in your face 💦😜 text on 0410 416 939 to make a booking
0:29

I've got times available tomorrow!!!! Come get a fresh cut and titts in your face 💦😜 text on 0410 416 939 to make a booking

Lacethebarber 💈 Melbourne's nude Barber

23,859 görüntüleme • 2 yıl önce

PhD Students – Use this tool to paraphrase the text in your manuscript for FREE. First, why you need to paraphrase? The first draft you write is often very rough. It needs to be revised to polish it for submission. For this, you can use a paraphraser. Here is one you can use it for FREE. 1. Go to and log in. 2. Upload your file or copy/paste your text in a new file. 3. From the options on right, click Paraphraser. 4. Now select the text you want to paraphrase. 5. After text selection, click paraphrase. 6. Trinka.ai will show the paraphrased text. 7. You can also see the changes made. 8. You can increase or decrease the level of paraphrasing. 9. You can also select to show the revisions. 10. Go through the paraphrase text carefully. 11. You can choose among multiple paraphrased alternatives. 12. After your final selection, click replace. 13. This will replace original text with paraphrased text. 14. You can apply this process for the entire text. Make sure that you go through the changes made. This is important so that only your text gets refined. However, the meaning of the text remains the same. In addition to paraphrasing, Trinka also offers to ➝ Fix all grammatical errors in your manuscript ➝ Proofread your manuscript before submission ➝ Check consistency in your manuscript writing ➝ Evaluates the level of bias in your writing ➝ Checks plagiarism level in your manuscript Try Trinka.ai here: Anything you’d like to add?
1:00

PhD Students – Use this tool to paraphrase the text in your manuscript for FREE. First, why you need to paraphrase? The first draft you write is often very rough. It needs to be revised to polish it for submission. For this, you can use a paraphraser. Here is one you can use it for FREE. 1. Go to and log in. 2. Upload your file or copy/paste your text in a new file. 3. From the options on right, click Paraphraser. 4. Now select the text you want to paraphrase. 5. After text selection, click paraphrase. 6. Trinka.ai will show the paraphrased text. 7. You can also see the changes made. 8. You can increase or decrease the level of paraphrasing. 9. You can also select to show the revisions. 10. Go through the paraphrase text carefully. 11. You can choose among multiple paraphrased alternatives. 12. After your final selection, click replace. 13. This will replace original text with paraphrased text. 14. You can apply this process for the entire text. Make sure that you go through the changes made. This is important so that only your text gets refined. However, the meaning of the text remains the same. In addition to paraphrasing, Trinka also offers to ➝ Fix all grammatical errors in your manuscript ➝ Proofread your manuscript before submission ➝ Check consistency in your manuscript writing ➝ Evaluates the level of bias in your writing ➝ Checks plagiarism level in your manuscript Try Trinka.ai here: Anything you’d like to add?

Faheem Ullah

18,055 görüntüleme • 1 yıl önce