코딩 슬라임 공방

See the Pen oNjrBBN by Lee Hoyeon (@nixpluvia) on CodePen.

See the Pen qBOozLj by Lee Hoyeon (@nixpluvia) on CodePen.

See the Pen gOaexdO by Lee Hoyeon (@nixpluvia) on CodePen.

See the Pen gOavJXW by Lee Hoyeon (@nixpluvia) on CodePen.

See the Pen BaoYKOx by Lee Hoyeon (@nixpluvia) on CodePen. 주의점 float요소를 가지고 있는 부모에게 ::after 선택자를 사용해서 clear를 해줘야 한다. 제작 하면서 주의해야 할 점은 하위 메뉴가 너무 커서 아래 이미지사진의 범위까지 침범하는데 그 때에 이미지 아래에 하위메뉴가 가려져 버리는 불상사가 발생하는데 그 때 z-index를 사용해서 하위메뉴를 이미지 위에 띄운다. 서브 이미지들도 float를 사용해서 정리하지만 하위에 붙어야 하는 이미지 2개는 붙지 않으므로 position을 사용해서 정리해준다.