css zoom 사용시 이미지에 여백이 생기는 경우, zoom gap image

문제 발생 조건
zoom:0.7 
등으로 조절함(transform:scale() 도 같은 문제 생길 것 같음)

이미지가 리사이즈에서 다시 zoom 으로 크기가 조절 됨.
이 때 오른쪽이나 하단에 여백이 생길 수 있음.
해결법은 딱히 없으며, border 등을 사용했다만 감추기 위해서 border 와 같은 색으로 box-shadow 를 해주면, 여백이 box-shadow로 가려진다.


/* zoom 적용시 이미지에 gap 보이는 현상 제거용 */
.img-box img{
    box-shadow: 1px 1px 0px 1px #000;
}
댓글
  • No Nickname
    No Comment
  • 권한이 없습니다.
    {{m_row.m_nick}}
    -
목록형 📷 갤러리형
제목
[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js)
유용한 리눅스(LINUX) 명령어
[공지] 기술 게시판
2.1
2.2
2.3
2.4
2.5
2.6
2.7
2.8
2.9
2.10
2.11
2.12
2.13
2.14
2.15
2.16
2.17
2.18
2.19
2.20
2.21
2.22
2.23
2.24
2.25
2.26
2.27
2.28