[Dev_Log] 8/24 (화) 김정빈

## 오늘의 프로젝트에서 배운 점은 무엇인가요?

- **디자인의 길은 멀고도 험하다**

어제 메인페이지의 전체적인 디자인을 손보고, 오늘은 메인페이지-피아노 부분과 메인페이지-마이크 부분의 css를 일정하게 만들었다.
사실 저 피아노의 위치를 꽤 오랫동안 고민하다가, 디자인 수정을 끝마쳤다. UI/UX를 최대한 고려하여 하다보니 코드작업보다 세밀한 값변경을 더 많이한 것같다. 그리고 이번에 하면서 느낀점은, `position:absolute` 를 좀더 잘 사용할 수 있게 됐다.
원래는 flex 기능을 주로 사용했는데, 이 기능은 정렬에는 유용하지만 특정 위치로 정확하게 보내기란 쉽지 않았다.
position:absolute와 함께 left, right, top, bottom 을 사용하여 위치를 지정했다. 굉장히 사용하기 쉬운 기능이지만, 막상 position을 정확하게 파악하고 사용하지 않는다면 굉장히 불편한 기능이기도 하다.
메인페이지의 왼쪽편 흰색 부분은 사실 배경과 안에 기능이 2개의 레이어로 나누어져있다. 이렇게 한 이유는 내부 기능들이 위아래로 퍼지는 것을 방지하고자 높이를 60%으로 맞추고, 뒤에 배경을 position:absolute를 이용하여 크기를 맞추었다.

```js