Contents
Quick reference
| Class | Properties |
|---|---|
.text-wrap | white-space: normal; |
.text-nowrap | white-space: nowrap; |
Basic usage
Wrap
Use text-wrap to cause text to wrap normally within an element. Newlines and spaces will be collapsed.
Hey everyone! It's almost 2022 and we still don't know if there is aliens living among us, or do we? Maybe the person writing this is an alien. You will never know.
<div class="max-w-sm">
<!-- max-w-sm : 384px -->
<p class="text-wrap">Hey everyone! It's almost 2022 and we ...</p>
</div>
No wrap
Use text-nowrap to prevent text from wrapping within an element. Newlines and spaces will be collapsed.
Hey everyone! It's almost 2022 and we still don't know if there is aliens living among us, or do we? Maybe the person writing this is an alien. You will never know.
<div class="overflow-x-auto max-w-sm">
<!-- max-w-sm : 384px -->
<p class="text-nowrap">Hey everyone! It's almost 2022 and we ...</p>
</div>
Edit this page on Github
Last edited by zhengchun on November 30, 2023