Jak złapać whitespace w CSS?

  <div class="content">
    <% if (info || continuedInfo ) { %>
      <span class="info"><%= info %></span>
      <span class="counter">3</span>
      <span><%= continuedInfo %></span>
    <% } %>
  </div>

info i continuedInfo to 2x textarea i jeśli się cos tam wpisze to wyswietlane jest to uzytkownikowi. Problem jest taki, ze jesli osoba ktora wypełnia textarea zrobi enter przy info na końcu zdania to nie jest wyrownane rownolegle tylko jest spacja przez nbsp i wygląda to tak
https://zapodaj.net/f9648c037bccb.png.html
tak to wyglada na stronie:
https://zapodaj.net/f8fb8a67490c2.png.html?fbclid=IwAR309pjL1LgRBMox4RCrlJ7N6fy6R4CDU5s4-iSAychwmxBdJi58xKW0ZyA

Probowałem to złapac w css ale nie działa :P

.info:contains(' ') {
  display: none;
 }

dcielak napisał(a):

Probowałem to złapac w css ale nie działa :P

.info:contains(' ') {
  display: none;
 }

A co to za twór? To nie jest CSS!
W CSS nie ma pseudo-klasy contains.

Musiałbyś skasować  , przykładowo przez replace.

const content = `
  lorem ipsum
  <br>
  &nbsp;
`;

const newContent = content.replace(/(&nbsp;)+/gm, ' ');

console.log(newContent);

EDIT:

Jeśli chcesz zrobić to jedynie w CSS to możesz spróbować

https://stackoverflow.com/a/66646082
https://gist.github.com/jonathanhefner/3229878
https://stackoverflow.com/a/25133863

ale nie ma w 100% pewnego sposobu żeby to zrobić i może nie działać

No a nie możesz po ludzki nie renderować tych znaków których nie chcesz? Użyć np String.trimEnd() zanim wsadzisz swoje wartości w template?

Bo to co próbujesz zrobić, to wyrenderowałeś sobie tekst z enterem na końcu, który dodaje Ci   i chcesz go teraz schować w CSS. Zamiast po prostu nie renderować go.