반응 형 사이드 바/사이드 너 디스플레이 (모바일 전용)

Question

반응 형 디자인에 익숙하지 않은 사람은 내 머리 위로 날아갑니다. 내 사이트는 데스크톱에서 완벽하게 작동하며 크기를 조정하면 올바르게 작동합니다. 오른쪽 상단 메뉴는 숨겨져 있어야하지만 모바일 장치에서만 홈페이지에 착륙 할 때 표시됩니다. http://fireflyaz.com/assets/templates/posterservice-html5/images/example.jpg

라이브 예 (단지 모바일 장치의 문제) 다음 default_modified.css에서 http://www.fireflyaz.com/

Answer 1

, #showSlideMenu 대한 CSS 50 %의 폭을 설정하고, 그래서이 경우에도 나타나 스크린 샷

사이드 바가 열려 있지 않습니다. 클래스 이름을 # showSlideMenu.cbp-spmenu-open으로 변경하면 css는 사이드 바가 열려있을 때만 적용됩니다. 귀하의 스타일은 다음과 같습니다 :

#showSlideMenu.cbp-spmenu-open { 
    float: right; 
    overflow: hidden; 
    text-align: right; 
    width: 50%; 
}