[React] 공백문자 추가 &nbsp

📱테스트 환경

"react": "18.2.0"
"react-dom": "18.2.0"
"typescript": "^4.9.5"

---

이게 웃긴게 공백문자를 넣으려고 하는데 {" "} 이렇게 넣으면 인식을 못한다.

<Username>
    By{" "}John
</Username>

공백문자를 넣어야할 때 사용하는게 바로   이다.

Non-breaking Space 의 줄임말로 줄바꿈이 일어나지 않는 공백문자라는 의미인데

HTML 에서 스페이스 바 처리가 필요할 때 사용한다.

여러 개를 사용해서 공백문자를 여러개 삽입할 수도 있다.

<UserName>
    By&nbsp;&nbsp;&nbsp;John
</UserName>

근데 말 그대로 줄바꿈이 일어나지 않기 때문에 무분별하게 사용하면 내가 원하는 대로 안되겠지 ?

그럼 줄바꿈도 하게 하려면 어떻게해야하냐면 CSS 를 사용하면된다.

white-space: pre-wrap;