CSS: 반응형 웹 텍스트 만들기 word-break: break-word

반응형 웹을 만들고 있는데 개발자 도구에서 폰으로 보면
여러 방법들을 계속 써봐도 텍스트에 가로형 스크롤바가 계속 나타났다.

해결책으로 가장 쉬운 방법은 css에 word-break: break-word;로 지정하는 것이다.

word-break: break-word;

내가 쓴 코드)

<td>
    <p class="lead text-start rounded" style="background-color: rgba(255, 255, 255, 0.7);  word-break: break-word;">
        그린컴퓨터아카데미 울산캠퍼스에서 진행한 팀프로젝트입니다.<br>
        <!-- <br> <b style="font-weight: bold;">기간</b>: 2023.04-2023.06<br>  -->
        <b style="font-weight: bold;"> 주요 기능</b>: 4월 17일에서 6월 15일까지 진행 완료 후 적을 예정입니다.<br> 
        <b>GitHub</b>: <a href="https://github.com/yjyuwisely/Team-Project-2023" title="깃허브로 이동"> 
        github.com/yjyuwisely/Team-Project-2023</a><br>
        <b>Frontend</b>: 4월 17일에서 6월 15일까지 진행 완료 후 적을 예정입니다.<br>
        <b>Backend</b>: 4월 17일에서 6월 15일까지 진행 완료 후 적을 예정입니다.<br>
	</p>
</td>

 word-break: break-word; 추가 전 가로형 스크롤바가 나타난다.

word-break: break-word; 가로형 스크롤바가 나타난다.

 word-break: break-word; 추가 후 가로형 스크롤바 없이 텍스트 전체가 보인다.

word-break: break-word;쓴 후. 가로형 스크롤바가 없이 텍스트가 정렬된다.:)