목록반응형div (1)

오늘 뭐했지?

[HTML/CSS] 반응형 %를 이용해서 가로세로 비율을 맞춘 div 박스 생성하는법

반응형 작업을 하는 경우에 div 박스에 width 값은 %로 줄 수 있지만 height 값은 %가 적용 되지않아서 비율을 어떻게 맞춰야하나 고민했던 경우가 있었는데요. 이럴 때 높이대신에 div에 padding-bottom:을 이용해서 % 값을 주면 간단하게 해결할 수 있습니다. div{width:50%; margin:0 auto; padding-bottom:30%; background-color:#eee;} 만약에 박스 안에 컨텐츠를 넣을 경우엔 감싸는 div에 position: relative;를 주고 컨텐츠는 absolute로 주어서 넣어주시면 됩니다! .wrap{width:50%; margin:0 auto; padding-bottom:30%; background-color:#eee; positi..
웹디자인/HTML,CSS 2019. 10. 29. 14:04
이전 Prev 1 Next 다음