6 Replies
in 1st image you can see all texts are aligned on same width but on 2nd one
oppournities on on below line which creates a gap thereConsider throwing a text-wrap property
https://developer.mozilla.org/en-US/docs/Web/CSS/text-wrap
MDN Web Docs
text-wrap - CSS: Cascading Style Sheets | MDN
The text-wrap CSS property controls how text inside an element is wrapped. The different values provide:
it probably just doesn't fit on that line and has a natural line wrap
when you count the first line, it are 80 chars. with the 'oppertunities' added to the second line, it would have been 82 chars (including spaces)
probably you have set a maximum width (80ch?) on the container which does make that word wrap to the next line
I do want to mention that you're asking a lot of questions with only showing a screenshot. We can not tell what actually is going on if you don't share the code (preferably in a working codepen/sandbox)
This is a very detailed answer
it's beacuse im working on react application and i need to add lot of code in sandbox manually
the only thing that matters is the frontend output in this case. You can copy / paste the contents of the body tag into codepen and upload your CSS