[highlandadventuresParticipant]

hi…how can i set the number of pixels that triggers the mobile layout. In particularly we want to set this for ipad mini landscape size….i other words, we don’t want to the sider to show for screens smaller than ipoad mini landscape size. thanks, c

[Prasant RaiModerator]

Hello There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[highlandadventuresParticipant]

http://www.machupicchu.com

[RubinKeymaster]

Hey There,

Due to the responsive nature of our theme it’s not possible to disable the responsiveness. Changing the viewports is a very advanced thing to do and required coding knowledge. This is outside the scope of support we can provide so if you really want to go down that path we can give you some guiding but whenever you update the theme all viewport changes will break as our theme is intended to provide the best experience possible on any device.

[highlandadventuresParticipant]

hi…tks for the reply. my question was not clear. I love responsiveness. I just want to trigger responsiveness to be like it is on a cell phone with sidebars flowing to the botton when the site is seeing on an ipad mini…right now, the sidebar looks wear and overflows on an ipad mini portrait…It would look much better if the content behave like when seeing on a Samsung Galaxy Note 5 or any cell phone.

I notice some CSS on the knowledge base that could take care of this but could not make it work.

I am sure there is a setting where I can trigger mobile view for a set number of pixels or below.

Hope this clear the question.

Looking forward to the CSS or place where the setting can be modify.

Thanks,

Cristian

[Paul RModerator]

Hi Cristian,

You can try adding this in custom > css in the customizer.

@media (max-width: 1024px) {
.x-column.x-sm {
    float: none;
    width: 100%;
    margin-right: 0;
}
.x-main.full, .x-main.left, .x-main.right, .x-sidebar.left, .x-sidebar.right {
    float: none;
    display: block;
    width: auto !important;
}
}

Hope that helps.

[Author]

Posts