구글 이미지 검색 결과 반응형으로 보려면?
본문
질게에 질문도 잘 안 올라오길래 오랜만에 질게 활성화 위해 질문해 봅니다.
해결을 바라고 올리는 질문이 아니라 그냥 심심하신 분 도전해보시란 차원. ㅎ
스타일봇 확장프로그램 이용해 애용하는 웹사이트 커스텀해서 보곤 하는데,
구글 사이트 코드는 졸라 더티(Dirty)해서 커스텀 하는 게 어렵더라구요.
(소스 보기 해보시면 이해하실 거에요. ㅜㅜ)
예를 들어 아래와 같은 검색 결과가 있을 시, Ctrl 키를 누른 채 한번 스크롤 하면 가로 스크롤 없이 이미지가 좀 더 커진 상태로 보입니다. 그런데, 더 스크롤 굴리면 가로 스크롤바 생기면서 현재 상태 그대로 이미지가 커집니다. 그러다보니 우측 이미지가 가려져서 보기 힘들어지더라구요.
현재는 더 키워서 왼쪽 이미지 다 본 후, 다시 스크롤바 우측으로 이동시킨 후 다시 위에서 보는 식으로 하고 있어요. ㅜㅜ
https://www.google.com/search?q=%EA%B7%B8%EB%88%84%EB%B3%B4%EB%93%9C5+%EC%8A%A4%ED%82%A8&newwindow=1&sca_esv=f9d89d3354f353fb&udm=2&biw=640&bih=279&sxsrf=AE3TifPTdFRF-xlArnmLhNTHqSkhO0UyYw%3A1760761600972&ei=ABfzaNmNO4LN1e8P5aOw-QQ&ved=0ahUKEwjZjYqO9KyQAxWCZvUHHeURLE8Q4dUDCBE&uact=5&oq=%EA%B7%B8%EB%88%84%EB%B3%B4%EB%93%9C5+%EC%8A%A4%ED%82%A8&gs_lp=Egtnd3Mtd2l6LWltZyIU6re464iE67O065OcNSDsiqTtgqgyBBAAGB5Ijx5Q_AlYrBxwAngAkAEBmAGSAaABtgmqAQMwLjm4AQPIAQD4AQGYAgigApAHwgIFEAAYgATCAgcQIxgnGMkCmAMAiAYBkgcDMi42oAfuGbIHAzAuNrgH_QbCBwkwLjIuMi4yLjLIB1w&sclient=gws-wiz-img
답변 2
/* 메인 검색 결과 컨테이너 */
#rso {
max-width: none !important;
width: 100% !important;
}
/* 이미지 그리드 컨테이너 */
#islrg {
max-width: none !important;
width: 100% !important;
}
/* 이미지 그리드 래퍼 */
div[data-ri] {
max-width: none !important;
}
/* 가로 스크롤 완전 제거 */
body {
overflow-x: hidden !important;
}
/* 확대 시에도 뷰포트 내 유지 */
#islrg > div {
width: 100% !important;
max-width: 100vw !important;
}
님의 무모함이 곧 매력이군요~~
마크업 뜯어보는 손가락이 근질근질해집니다.
소일용 탄창 장전 완료 ~ (●'◡'●)