장바구니 모바일버전 에서

 

모바일 환경으로 접속시 우커머스 장바구니가 이렇게 잘려서 나오는부분은 어떻게 해결해야할까요?

 

에프 12 스 css 를 수정해보려고 했지만 전체크기만 조절될뿐 맨앞의 테이블 코드를 찾을수가 없네요 ㅠ

 

도움 부탁드립니다 ㅠ

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    크롬 브라우저를 기준으로 설명을 드리자면

    올려주신 이미지에서 상품 쪽 CSS 속성이 궁금하시다면

    상품에 마우스를 올리신 후에 마우스 오른쪽을 클릭하신 후

    아래쪽에 검사(N)를 누르시면 상품 쪽 CSS 속성을 확인하실 수 있습니다.

    고맙습니다.

  • 네 그렇게 해서 오른쪽 클릭후 검사를 누른후 엘레멘츠 에서 해당 테이블을 찾아서 마우스 카피-카피셀렉서- 해서 함수를 찾고 거기에 필요한 값을 하나씩 추가해보면서 알아가고있습니다.

    위에 문의드린내용은 제가 css 를 적용해본 결과 (일단 제대로된 값은 못찾아내고있는거같습니다)

    해당 테이블의 전체적인 라인을 왼쪽으로 당기는게 목표인데

    찾아지는 값들로는 필드값을 하나씩밖에 찾지를 못하고있습니다

    그리고 사이즈를 줄였을때 우측의 상품값이 화면 안쪽으로 들어와야하는데

    사품위치는 그대로있게되네요 핡핡 ㅠㅠ

  • 모바일에선 테이블을 화면에 꽉 차게 하신다는 건지요?

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가해보시겠어요?

    @media only screen and (max-width: 479px) and (min-width: 320px) {
    	.container { width: 100%; }
    }

    고맙습니다.

  • 와 감사합니다!!!

    정말 정말 매번 너무너무 감사합니다

    도움주신 코드를 커스텀하면 이미지로 작업된 홈 화면에서도 적용이 가능할까요?

    홈에서 이미지 형식으로의 작업으로 된것들은 모바일화면에서 이미지가 잘려나오는 현상이 발생하는데

    검색해본결과 전체홈페이지 자체를 비반응형으로 바꿔야 한다! 는 것들 말고는 딱히 해답이 없었는데 

    도움주신 코드를 적용해보니 가능할것도 같아서 하나더 여쭤봅니다

  • 해당 코드를 적용하니 생각치 못하게 상품 페이지가 정렬이 왼쪽 벽으로 붙어버리는상황이 발생해버렸습니다 ㄷ ㄷ ㄷ
    둘중하나 포기해야 되는걸까요?ㅎㅎ
  • 안녕하세요.

    상품 페이지 쪽은 아래의 코드도 추가해보세요.

    @media only screen and (max-width: 479px) and (min-width: 320px) {
    	#primary.with-right-sidebar { width: 100%; }
    }

     

    저희가 모든 코드를 안내해드리기엔 현실적으로 어렵습니다.

    PC와 모바일에서의 CSS 속성을 다르게 주시려면

    미디어 쿼리에 대해 구글에 검색해보시면 많은 정보들이 있으니 참고해보시겠어요?

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기