swiper 가로사이즈가 너무 크게 출력됩니다.
본문
카페24 쇼핑몰 이용중인데 가로가 브라우저 사이즈에 맞춰지는게 아니고
거의 세배 가까이 커지네요.... 스와이퍼 css랑 js는 수정한게 없는데
https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.1/js/swiper.js
https://unpkg.com/swiper/swiper-bundle.min.css
js css는 위에서 끌어다 쓰고 있습니다.
출근해서 지금까지 이것만 붙들고 있네요 ㅠㅠㅠ
답변 3
<li class="swiper-slide swiper-slide-active" data-swiper-slide-index="2" style="width: 2863px;">
2863px이 잡힙니다.
swiper-slide 안에 내용에 따라
자동 계산되어 나오는 가로값으로 보시면 됩니다.
소성보기로 보시면
.sec02 .swiper-slide div
.sec02 .swiper-slide div.text
이 css를 수정하셔야 할거 같습니다.
직접 소스를 만져보지 않아 정확하지는 않지만
float left, right 을 display:inline-block 처럼 바꾸신다음 사이즈 조절은 어떠실까용?
.sec02 .swiper-slide div.text 여기에서
padding 150을 줬으면 width:calc(50% - 300px) 로 되야될거 같구요
정확히는 못찝어 드리지만 li 안의 div들을 다시 한번 만져보세요
저도 가끔 이런현상을 겪어본 기억이 나서 남겨봅니다.
li 안쪽에 div가 들어가면서 css 때문으로 보입니다.
왜인지 모르겠습니다만 멀티트리플님 답변대로 css 만져봣는데 text에 패딩들어간게 문제가 되더라고요... 잘 해결했습니다. 감사합니다.
<style>
.swiper-slide img{max-width:100%}
</style>
css 추가해보셨나요?
구조가 swiper-slide 안에 div가 왼쪽 오른쪽 해서 50%씩 나눠놓은거라 이미지 사이즈랑은 상관없는듯 하네요 ㅠㅠㅠ
swiper-container에 max-width : 1920px을 줘버리세요
답변 감사합니다~
