Dev Log #32 - 8월 10일

오늘 학습한 내용

✅ 1. 네이버 게임 main_right 카피캣

1. 네이버 게임 main_right 카피캣

• position을 absolute로 적용하게 되면 flex의 영향을 받지 않는다.

• overflow: hidden;을 어디에 적용하느냐에 따라 레이아웃이 달라진다.

• id는 한 문서안에 똑같은 id가 있으면 안된다.

👉 html

---

👉 css

---

👉 결과물

---

오늘의 학습 후기(어려웠던 점, 개선할 점)

오늘은 네이버 게임 main_right 영역 카피캣 하는 시간을 가졌다. 확실히 main_left를 작업해서 그런지 right부분은 간편하게 해결 할 수 있었다. 미리 공통된 레이아웃을 따로 뽑아서 작업하다 보니 반복 작업을 줄여 효율적으로 진행할 수 있었다. 이러한 부분은 나중에 실무에서도 유용하게 쓰일 것 같다. 오늘 수업 중 가장 임상 깊었던 부분은 순위를 매기는 count_wrap에서 position을 absolute로 두어서 flex 영향을 받지않고 자유자재로 배치한 부분이다. 위의 방식은 컴포넌트 위치 지정 시 조금 더 세밀하게 작업 할 수 있을 것 같다는 생각이 들었다. 내일도 열심히 임해야겠다👩🏻‍💻🔥