css가 적용되지 않을 때 우선적으로 확인해야 할 것

비동기적으로 html을 화면에 뿌리는 것은 웹 개발자라면 필연적으로 생성해야 합니다.

하지만 이렇게 비동기적인 html을 화면에 뿌릴 때 css가 적용되지 않는 경우가 있습니다.

제가 겪은 예로는, 용어 사전 관련하여 초성 검색시 리스트를 화면에 뿌려야 하는데 'ㅅ'으로 초성 검색을 할 때마다

css가 적용되지 않았습니다.

원인은 영어, 숫자였습니다.

영어, 숫자가 길어지면서 width를 무시하는 것입니다.

그래서 word-break: break-all 속성을 넣어줌으로써 해결할 수 있었습니다.

 

이렇듯 화면에 css 속성이 적용되지 않을 때에는 우선적으로 영어나 숫자를 확인하는 것을 추천합니다.