구현하기 | Notion"> 구현하기 | Notion">

<목표>

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/b33cb45b-df30-4357-b63c-e53520907b37/Untitled.png

<중간 과정 1>

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/0fb344ee-001f-4003-a59d-d6eeeddacda0/Untitled.png

<aside> ❓ element의 크기보다 짧은 border는 어떻게 만들어야 할까?

</aside>

<aside> ⭐ 가상요소(::after, ::before)를 필요한 border 크기와 같은 size로 만들고 거기에 border를 입힌다. 이렇게 하면 margin도 사용할 수 있기에 원래 element와의 거리도 조절할 수 있다.

</aside>

<aside> 💡 article 배치를 display: grid로 하고 싶은데 생각만큼 쉽지가 않다. display: flex로 하려고 해도 여러 줄의 container를 배치하는 건 처음이라 공부해야 한다. 내일은 레이아웃 잡는 것까지 끝내자.

</aside>

<중간 과정 - 2>