# 태블릿에서 사이트가 반응이 없습니다
**URL:** https://meta.discourse.org/t/site-not-responsive-in-tablet/241351
**Category:** Bug
**Tags:** advertising, sidebar
**Created:** [10월 8, 2022, 5:29오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351 "2022-10-08T17:29:00Z")
**Posts on this page:** 18
**Page:** 1
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 8, 2022, 5:29오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/1 "2022-10-08T17:29:01Z")
안녕하세요,
제 웹사이트가 태블릿에서 반응형으로 표시되지 않는 것을 발견했습니다. 하지만 안전 모드에서 플러그인을 비활성화하면 반응형으로 정상 작동합니다. 제 웹사이트에는 공식 플러그인만 설치되어 있습니다.
제 웹사이트에 설치된 플러그인은 다음과 같습니다:
이 문제는 메타(meta)에서는 보이지 않습니다. 메타가 discourse-adplugin을 사용하지 않기 때문이라고 생각합니다.
태블릿에서 확인되는 웹사이트 화면:
---
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [10월 8, 2022, 5:48오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/2 "2022-10-08T17:48:19Z")
애드블로커를 비활성화하거나 시크릿 모드를 사용해 보시겠어요? 효과가 있는지 확인해 보세요.
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 8, 2022, 5:58오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/3 "2022-10-08T17:58:21Z")
시크릿 모드에서도 동일한 문제가 발생합니다.
새로운 사이드바와 관련이 있는 것 같습니다. 햄버거 메뉴를 사용해 사이드바를 숨기면 사이트가 반응형으로 작동하고 화면에 완벽하게 정렬되거든요.
---
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [10월 8, 2022, 6:05오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/4 "2022-10-08T18:05:12Z")
태블릿이 없어서 직접 테스트를 해볼 수는 없지만, `enable experimental sidebar hamburger`와 `enable sidebar` 관리자 설정을 비활성화해 보시고, 단기적으로 도움이 되는지 확인해 주실 수 있을까요?
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 8, 2022, 6:12오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/5 "2022-10-08T18:12:53Z")
네, 사이드바 설정 두 가지를 비활성화하면 사이트가 다시 반응형으로 동작하고 화면에 맞게 정렬됩니다. 문제는 사이드바와 관련이 있습니다.
---
### Author:  [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 8, 2022, 6:18오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/6 "2022-10-08T18:18:25Z")
안녕하세요,
해당 사이트에서 재현할 수 있습니다. 상단 광고가 고정 폭으로 설정되어 있기 때문이라고 생각됩니다. 반응형 광고 유형을 선택할 수 있는지, 아니면 CSS로 폭을 설정할 수 있는지 확실하지 않습니다. 🤔 아마도 Discourse 광고가 사이드바와 더 잘 작동하려면 몇 가지 업데이트가 필요할 수도 있고, 혹시 광고에 대한 수정 사항이 있으신가요?
---
### Author:  [@khenmu](https://meta.discourse.org/u/khenmu)
#### Post date: [10월 8, 2022, 6:18오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/7 "2022-10-08T18:18:50Z")
참고로, 제 iPad Pro에서는 다음과 같이 보입니다.
설정을 변경한 후 다시 시도해 보길 원하시면 말씀해 주세요. 👍
> **Adblocker 활성화됨**
>
> 
> 
> 
> **Adblocker 비활성화됨**
>
> 
> 
> 
---
### Author:  [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 8, 2022, 6:29오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/8 "2022-10-08T18:29:49Z")
새로운 또는 기존 테마 컴포넌트에 이 코드를 추가하여 어떻게 작동하는지 확인해 볼 수 있을까요?
Desktop / CSS
```scss
@media screen and (max-width: 1000px) {
.google-adsense .google-adsense-content {
width: 100% !important;
}
}
```
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 8, 2022, 6:39오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/9 "2022-10-08T18:39:05Z")
CSS를 추가했습니다. 이제 메인 사이트에서는 문제가 없지만, 모든 페이지에서 문제가 발생합니다.
광고에 대한 수정은 전혀 하지 않았습니다. 광고 목록 위에 고정 크기의 AdSense 플러그인 광고를 사용하고 있습니다.
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 8, 2022, 6:40오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/10 "2022-10-08T18:40:36Z")
설정을 변경했습니다. 한 번 더 시도해 주시겠어요??
---
### Author:  [@khenmu](https://meta.discourse.org/u/khenmu)
#### Post date: [10월 8, 2022, 6:46오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/11 "2022-10-08T18:46:37Z")
명확한 차이를 찾지 못했는데, 캐시 때문일까요?
> **애드블로커 활성**
>
> 
> 
> 
> **애드블로커 비활성**
>
> 
> 
> 
---
### Author:  [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 8, 2022, 7:25오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/12 "2022-10-08T19:25:30Z")
아, 그렇군요. 문제는 고정 폭 광고에 있는 것 같습니다. 예를 들어 사이드바가 접힌 상태로 사이트를 열었다가 사이드바를 다시 열면, 전체 크기의 광고까지 오른쪽으로 당겨지고, 페이지를 새로고침해야만 광고 폭이 제대로 업데이트됩니다.
아쉽게도 지금 제 테스트 사이트에서 바로 확인해 볼 수는 없습니다.
하지만 이런 방식이 다른 광고에도 적용될 수 있을 것 같습니다. 이전 코드를 아래처럼 수정해 보실 수 있을까요?
```scss
@media screen and (max-width: 1110px) {
.google-adsense .google-adsense-content {
width: 100% !important;
.adsbygoogle {
width: 100% !important;
> div {
width: 100% !important;
}
}
}
}
```
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 8, 2022, 7:34오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/13 "2022-10-08T19:34:58Z")
이전 CSS를 새로운 것으로 교체했습니다. 하지만 메인 사이트에서는 문제가 없는데, 모든 페이지에서 여전히 동일한 문제가 발생하고 있습니다. 캐시도 삭제해 봤지만 결과는 같습니다.
---
### Author:  [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 8, 2022, 8:24오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/14 "2022-10-08T20:24:38Z")
죄송합니다. 지금은 이게 제가 드릴 수 있는 최고의 팁입니다. 하지만 적어도 광고가 이 문제를 일으킨다는 것은 이제 알 수 있게 되었습니다. 미래의 수정 사항과 충돌하지 않도록 확실하게 하려면 해당 코드를 제거할 수 있다고 생각합니다. 🙂
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 9, 2022, 4:08오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/15 "2022-10-09T16:08:30Z")
도와주셔서 감사합니다. 누군가 이 문제를 빨리 해결해 주길 바랍니다.
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 9, 2022, 8:56오후 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/16 "2022-10-09T20:56:48Z")
메타에서도 모든 페이지에 동일한 문제가 있다는 것을 발견했습니다.
---
### Author:  [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 10, 2022, 5:54오전 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/17 "2022-10-10T05:54:02Z")
안녕하세요, 네, 재현해 볼 수 있습니다. 토픽 페이지에서 사이드바가 열린 상태에서 790px 미만일 때 하단의 `.loading-container`의 max-width가 이 문제를 일으키는 것 같습니다.
`.has-sidebar-page`가 사용 가능한 경우, 이 계산에 `--d-sidebar-width`를 추가하는 것이 좋을 것 같습니다.
하지만 저는 모바일 뷰에서 해당 화면 크기에 대해 더 나은 경험을 할 수 있을 거라고 생각합니다.
요약하면:
최신 페이지에서는 상단 광고의 고정된 폭이 이 문제를 일으키며, 위에서 언급한 토픽 페이지에서도 마찬가지입니다.
이 빠른 수정이 당신에게도 작동할 것입니다.
Desktop / CSS
```scss
.google-adsense .google-adsense-content {
max-width: 100%;
.adsbygoogle {
max-width: 100%;
> div {
max-width: 100%;
}
}
}
@media all and (max-width: 790px) {
body.has-sidebar-page {
.topic-area > .loading-container {
max-width: calc(100vw - var(--d-sidebar-width) - 32px);
}
}
}
```
---
### Author:  [@Pravi](https://meta.discourse.org/u/Pravi)
#### Post date: [10월 10, 2022, 11:39오전 UTC](https://meta.discourse.org/t/site-not-responsive-in-tablet/241351/18 "2022-10-10T11:39:21Z")
Don 씨, 감사합니다. 이제 사이트가 반응형으로 작동하며 제 태블릿에서 예상대로 잘 동작합니다. Discourse 스태프가 메타 사이트에서도 이 버그를 수정해 주기를 바랍니다.