Kevin Powell - CommunityKP-C
Kevin Powell - Community15mo ago
7 replies
Vito

Best practice for forcing text to wrap onto new line on a specific word

Currently I'm trying to wrap text onto 3 lines. I want the text to wrap on a specific word. My current solution is using <br/> elements but I read that is not a good practice and is bad for screen readers. How do I force line breaks on a specific word without affecting accessibility?
   
<h2 className="text-2xl sm:text-4xl text-center sm:text-left mb-6 font-bold drop-shadow-[3px_3px_0px_hsl(0,0%,82%)] ">
  Lorem ipsum dolor sit,
  <br />
  consectetur adipiscing,
  <br />
  sed do eiusmod labore?
</h2>
image.png
Was this page helpful?