[아보카도 에디션] 모바일에서 pc화면의 메뉴 레이아웃 유지하는 방법

안내에 앞서 이 방법은 상단메뉴를 사용하실 때에만 하시는것을 추천드립니다.

좌측메뉴를 유지하실 경우에는 메뉴를 제외한 본문 너비를 고정시켜서 스크롤해서 보거나 화면을 축소시켜서 봐야 하기 때문에 가독성이 매우 떨어지는 관계로 추천하지 않습니다

 

수정파일: css 폴더의 _manager.css.php, style.css

_manager.css.php 에서는 22줄쯤의 $tab_width = 1000; 이부분의 숫자를 0으로 바꿔주세요.

style.css 파일은 먼저 Web Size Viewer Control - 반응형 코딩 .... 이라는 주석이 달린 부분 아래를 표시한 부분을 제외하고 전부 삭제합니다

그리고 그 아래 @media all and (max-width: 1000px) { 아래 body...부터

.open-gnb #gnb_control_box img { opacity: 0; }

까지 삭제합니다.

맨 아래 따로 떨어져있는 중괄호}는 지우지 않도록 유의해주세요

* 나중에 다시 사용하실 경우를 대비해 내용을 /* */ 사이에 넣어 주석처리 하실 수도 있습니다

이렇게 설정하시고 나서 보시면 일부 레이아웃이 깨지거나 별로 보기 좋지 않을수도 있습니다.

위쪽에서 삭제하고 남은 

@media all and (max-width: 1000px) {

이 사이에 스타일을 알맞게 추가하시면 되겠습니다.

1000픽셀 이하의 스크린에서 적용될 스타일이라는 의미로 1000px 를 다른 숫자로 바꾸시면 해당 너비 이하부터 적용됩니다. 각자 디자인이 다르기 때문에 자세한 내용은 생략합니다

} 

 

 

마지막으로 추천하지는 않지만 좌측메뉴상태의 본문 가로 너비를 고정시키는 방법입니다.

css 폴더의 default.css 파일을 열어 36번째줄의 

.fix-layout { position: relative; max-width: 1000px; margin: 0 auto; padding: 0 10px; } 

부분에 max-width:를 width:로 수정한뒤 아래

#header .fix-layout { width:100%; } 를 추가합니다.

본문 가로사이즈를 더 줄이거나 늘이고 싶으시다면 1000px를 다른 숫자로 바꿔주세요. 일부 스킨에서는 제대로 적용되지 않거나 작을경우 가로스크롤이 생길 수도 있습니다.