1. 정확한 제품 또는 플러그인 이름
코스모스팜 회원관리
2. 상세 내용
페이지 Restriction에서 Restricted로 설정한 페이지에 접속하면 나오는 로그인 화면이, 모바일에서는 좌우여백이 없이 좌우가 딱 붙어서 나옵니다.
그래서 좌우 여백을 주려고 하면 어떻게 해야 할까요?
3. 확인 가능한 상세 페이지 주소
https://ssbsa.or.kr/?page_id=46
4. 수정한 코드 내역 (있다면)
알려주시느라 고생하십니다.
아래의 기존 코드를 지우고
@media screen and (max-width: 600px) {
.cosmosfarm-members-form {
padding: 0 10px;
}
}
알려주신 아래 코드를 넣었으나 안되었습니다 ㅜㅜ
.cosmosfarm-members-form { padding: 0 10px !important; }
이러한 디자인 문제를 저만 문의하는건가요?
@media 부분을 제외하고
아래 코드를 입력해보시겠어요?
.cosmosfarm-members-form { padding: 0 10px !important; }
고맙습니다.
덕분에 수정은 완료했습니다.
아래 이미지와 같습니다.
https://imgur.com/a/GxwVqjK
그런데 모바일 화면에서 의도대로 좌우여백이 생기지 않습니다.
바뀐게 없네요.
CSS 하단의 padding: 0 10px;에서 10px을 숫자증가시켜도 그대로입니다.
확인좀 다시 부탁드립니다.
처음 선언된 @media 부분을 닫아주셔야 합니다.
추가하신 코드 위에 } 를 입력해보시겠어요?
고맙습니다.
안녕하세요
수정하였으나 1개의 오류가 있다고 합니다.
아래 링크 확인 부탁드립니다.
https://imgur.com/a/PpfOnKT
감사합니다.
안녕하세요~^^
테마 추가 css에 아래의 코드를 입력해보시겠어요?
@media screen and (max-width: 600px) {
.cosmosfarm-members-form {
padding: 0 10px;
}
}
고맙습니다.
알려주신 내용을 추가CSS에 넣었으나 아래 링크의 그림과 같이 오류사항이 있다고 합니다.
제가 코딩을 잘 몰라서요
수정사항 알려주시면 감사하겠습니다.
https://imgur.com/a/jiH4sW1
cosmosfarm-members-form 클래스가 100%로 무조건되게끔 되어서인데...
해당 클래스를 감싸고 있는 요소에 padding값을 주시면 됩니다.
일단 소스를 보니.... 모든 페이지에 동일한 요소들이 없는걸로 봐서는 가장 안전하게
#post-46{padding:20px;}를 그냥 주기만 해도 괜찮을 듯 싶습니다.
생각같아서는 코스모스팜 플러그인을 직접 수정
/wp-content/plugins/cosmosfarm-members/skin/two/style.css을 하시는 것도 좋겠지만...
이건 어디까지 업데이트되면 도루묵이니...
사용자정의하기>추가CSS에 #post-46값만 넣어주셔도 괜찮을 듯 싶습니다.