네이버 쇼핑 페이지를 따라해보는 김에, 헤더 영역 배경을 그라디언트로 비슷하게 만들어볼 수 있을 것 같아서 따로 방법을 찾아 적용해보았다.
참고한 사이트: MDN CSS linear-gradient 문서
역시 어려운 부분은 없지만 브라우저 사용자의 컴퓨터 환경에 따라 여백이 생기고 말고 하는 차이가 여전한 것 같아 그걸 자꾸 신경쓰게 된다.
정렬이 어긋나있는 것 같으면 멘토님이 알려주신대로 부모요소에 font-size를 0으로 적용해서 위쪽 여백을 없애준다. 다만 자식요소에 다시 font-size의 값을 주지 않으면 그대로 텍스트가 사라져보이기때문에 쓸 때 주의해야한다. 막상 배치를 끝내놓으면 여백이 없어져있는 경우도 있는 것 같아서 일단 배치를 해보고 어긋나있을 때 임시방편처럼 사용하는 게 좋은 방법인 것 같다.
익숙해진 것 같다가도 혼자 웹사이트의 레이아웃을 따라하게 되면 막힐 것 같아서 강의 내용을 보지 않고 혼자서 따로 연습해보는 것도 필요할 것 같다.