배경 이쁘게 넣는 스킬들 & margin collapse

background-image: url(../img/shoes.jpeg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;

• ../ (상위 요소로 가서 이동)
• cover (꽉 채우기)

주의해야 할 margin 버그

박스들의 테두리가 만나면 margin이 합쳐진다.
정확히 말하면
1. 마진을 하나로 합쳐주고
2. 혹여나 둘 다 마진이 있으면 둘 중에 더 큰 마진을 하나만 적용하게 된다.

<div class="main-background">
        <h4 class="main-title">Buy Our Shoes!</h4>
    </div>

위 코드에서 main-title에 margin을 주면 main-background도 같이 마진이 적용된다.
그래서 두 박스의 테두리가 겹치지 않도록 해주면 버그 해결.