[TIL] 03.31 이미지 위치 시키기

메인 페이지를 수정 하면서 4개의 이미지를 유동적으로 배치하는 작업을진행 하였다. 

어떻게 위치 시킬지에대해서 고민을 하다가 이미지를 감싸는 div를 만들어거 position: relative를 설정하고 이미지에 position: absolute 를 설정하여 top, left 값으로 위치를지정해 주기로 하였다 . 

 

그런데 문제가 발생하였다. 갑자기 가로 스크롤이 생겨버린 것이다. 왜 그런지 원인을 찾다가 알고 보니 이미지를 감싸는 div의 크기를 지정해 주지 않아서 이미지 크기가 늘어 날때 div의 가로 길이가 늘어 나서 전체 div의 크기를 벗어나버려서 스크롤이 생기는 것이였다. 

그래서 min-width로 크기를 정해주어 문제를 해결 하였다.