I need the text to overflow on the X axis just to reproduce some issue that I’m having on a bigger project. I leave a simple snippet, so you can tell me where I’m doing it wrong. Thanks!
.article {
background-color: rgb(236, 161, 161);
width: 20em;
}
.article p {
display: block;
} <article class="article">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Perferendis deleniti iure quidem distinctio officia voluptates similique molestiae culpa? Perferendis, velit maiores nobis maxime aut facere eaque quis voluptas accusamus commodi.</p>
</article>>Solution :
If you want the p tag to overflow on the x-axis, you simply need to tell it not to wrap using the white-space property:
p{
white-space: nowrap;
}