본문 바로가기

work

[css] position:absolute 가운데 정렬


/* absolute 가운데 정렬 : margin 사용*/
.box{
    width:500px;
    height:500px;
    position:absolute;
    top:50%;
    left:50%;
    margin-top:-250px; /* width의 절반값 */
    margin-left:-250px; /* height의 절반값 */
}

/* absolute 가운데 정렬 : transform 사용*/
.box{
    width:500px;
    height:500px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

'work' 카테고리의 다른 글

[jquery/js] 메일 자동완성 코드  (0) 2021.01.05
[js/jquery] 배열에서 최고, 최소 값 찾아오기 (jquery array max, min)  (0) 2020.12.28
[js] jqGrid  (0) 2020.12.28
무료 QR코드 생성기  (0) 2020.07.24
favicon 만들기  (0) 2020.07.24