갤럭시에서는 잘 나오는데 아이폰에서는 화면이 좌, 우로 움직입니다

1. 정확한 제품 또는 플러그인 이름

워드프레스

엘리멘터 헤더, 푸터

 

2. 상세 내용

모바일에서 갤럭시는  가로가 잘 고정이 되는데 아이폰에서는 가로로 화면이 움직입니다

아이폰에서도 좌 우로 움직임이 고정 됐으면 좋겠습니다

 

3. 확인 가능한 상세 페이지 주소

https://first-car.co.kr/

 

4. 수정한 코드 내역 (있다면)


.elementor-section,
.elementor-container,
.elementor-row,
.elementor-column,
.elementor-column-wrap,
.elementor-widget-wrap {
    min-width: 0 !important;
    max-width: 100% !important; 
    overflow-x: hidden !important; 


html {
    -webkit-text-size-adjust: 100%;
}


body {
    overflow-x: hidden;
    width: 100%;
}

 

워드프레스 에러 기술지원 서비스 전문가에게 맡기세요
워드프레스 에러 기술지원 서비스 전문가에게 맡기세요
  • AI에 의해 자동 생성된 답변이에요 😀

    아이폰에서 모바일 화면이 좌우로 흔들리는 현상은 주로 특정 요소가 화면 너비를 초과하거나, iOS의 렌더링 방식 차이로 인해 발생합니다. 이미 시도하신 CSS 코드에 몇 가지 중요한 속성을 보완하면 해결에 도움이 될 수 있습니다.

    워드프레스 관리자 페이지의 [외모] -> [사용자 정의하기] -> [추가 CSS] 영역에 아래 코드를 입력해 보세요.

    ```css

    html, body {

    max-width: 100%;

    overflow-x: hidden !important;

    position: relative;

    }

    /* 모든 섹션과 컨테이너의 가로 넘침 방지 */

    .elementor-section,

    .elementor-container,

    .elementor-column {

    max-width: 100% !important;

    overflow-x: hidden !important;

    }

    ```

    **추가 확인 사항:**

    1. **포지션 설정 확인**: 엘리멘터 위젯 중 `position: absolute`나 `fixed`가 적용된 요소가 화면 밖으로 나가 있는지 확인해 보세요. 특히 애니메이션 효과가 들어간 요소가 원인일 때가 많습니다.

    2. **패딩 및 마진**: 특정 섹션에 과도한 마이너스 마진(-)이 설정되어 있다면 아이폰에서는 이를 화면 확장으로 인식할 수 있습니다.

    3. **엘리멘터 설정**: 엘리멘터 편집 화면의 [설정] -> [레이아웃]에서 '콘텐츠 너비'가 모바일 기기 너비를 초과하지 않는지 다시 한번 점검해 보시기 바랍니다.

    위 코드를 적용한 후에도 증상이 계속된다면, 캐시 플러그인을 사용 중일 경우 반드시 캐시 삭제를 진행한 뒤 확인해 보세요.

    ↓ 아래 버튼을 눌러서 피드백해주세요.

  • 코드를 입력했더니 상단에 햄버거 버튼을 눌러도 메뉴가 나오지 않고 오른쪽은 고정이 됐지만 왼쪽에서 오른쪽으로 스크롤을 하면 페이지가 넘어 갑니

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기