워드프레스 게시판 KBoard(케이보드) 사용중입니다.
모바일에서 게시판 여백이 안보이게 하고 싶습니다.
안녕하세요~^^
모바일에서 게시판의 좌우 여백을 말씀하시는 건지요?
워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에
아래의 코드를 추가해보시겠어요?
@media screen and (max-width: 600px) {
.elementor-column-gap-default>.elementor-row>.elementor-column>.elementor-element-populated { padding: 10px 0; }
.site-container { padding: 0; }
}
CSS 속성인 padding 에 대한 내용은 아래의 링크를 참고해보세요.
https://www.w3schools.com/css/css_padding.asp
고맙습니다.
감사합니다. ^^
안녕하세요.
알려주신 대로
@media screen and (max-width: 600px) { .elementor-column-gap-default>.elementor-row>.elementor-column>.elementor-element-populated { padding: 10px 0; } .site-container { padding: 0; } }
를 넣었는데 변화가 없네요. (크롬 소스 보기를 보니 코드는 들어가 있습니다)
제 사이트는 http://www.noori-korea.com/wordpress/ 입니다
처음 들어가면 initial-scale=1로 보이긴 하는데 화면을 줄이면 여백이 많이 나와서 모바일 검색 체크를 하면 검색이 안된다고 나오네요
* Tap targets are small
* Content does not fit viewport - 이렇게요
또 이상하게도 하위 사이트인 http://www.noori-korea.com/wordpress/product/ 에서는 여백없이 제대로 나옵니다.
도와주세요 ii
안녕하세요.
사이트마다 레이아웃 구성이 다르기 때문에
CSS 코드 적용 방법이 다를 수 있습니다.
말씀하신 모바일 검색 체크는 어느 부분을 말씀하시는 건지요?
이미지 첨부가 가능하시다면
imgur에 업로드한 뒤 링크 걸어주시겠어요?
고맙습니다.
안녕하세요.
검색은 나중 문제고 우선 모바일에서 viewport가 제대로 작동이 되지 않는게 문제입니다.
첨부한 주소를 모바일에서 열어보면 콘텐트 크기가 다르게 나오는 걸 볼 수 있습니다.
고맙습니다
안녕하세요.
아래의 CSS 코드로 해결이 가능한지 확인해보시겠어요?
@media screen and (max-width: 600px) {
.elementor-section { padding: 30px 0 60px 0; }
}
위의 코드가 적용되지 않는다면
아래의 코드로 교체해서도 확인해보세요.
@media screen and (max-width: 600px) {
.elementor-section { padding: 30px 0 60px 0 !important; }
}
CSS 코드 수정 후에는 반드시 브라우저의 캐시를 비우신 후에 확인해주세요.
크롬 브라우저에서 강력 새로고침 단축키는 Ctrl + Shift + R 입니다.
고맙습니다.
감사합니다만 알려주신 모든 코드를 추가 / 캐쉬 삭제 / 전원 재부팅에도 여백은 없어지지 않는군요
i read complete article about css padding. css padding
https://elementtutorials.com/tools/hex-color-picker.html