FE/React
[React] 리액트 App.js 화면에 꽉 차게 설정
개발새발주발
2024. 6. 12. 17:20
728x90
💥 트러블 슈팅
문제점 :
개발 중 굉장히 거슬리는 문제 하나가 발생하였다..
맨 위 헤더 컴포넌트의 border를 설정했는데.. 저렇게 hr처럼 나온다.
확인해보니 화면에 꽉 차지 않는 이유 때문 !
아니 왜 App.js가 화면에 꽉 차지 않지?
그래서 style에 width : 100%도 추가해주었는데.. 되지 않았음 😭
하지만 문제는 생각보다 간단히 해결된다.
해결방법 - 기본 스타일 초기화
브라우저의 기본 스타일이 영향을 미칠 수 있다고 한다. CSS 리셋이나 노말라이즈 CSS를 사용하여 기본 스타일을 초기화하자 !
npm install normalize.css
// index.js
import 'normalize.css';
이렇게 간단하게 해결 가능 ~