[highlandadventuresParticipant]

hi…i am trying to figure out how can i kick-in the mobile menu when the site is being view on an ipad-mini (or smaller tablet) portrait view. please use this page: http://www.machupicchu.com/machu-picchu-tours/machu-picchu-amazon-tour/

I would like for the site to look the same on an ipad mini as it looks on a cell phone. Is there a setting in the customize to make that change for does it have to be a CSS. I love the theme, but the amount of CSS adjustment is getting large. tks. c

[ChristopherModerator]

Hi there,

Please add the following code in Customize -> Custom -> CSS :

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
#shiftnav-toggle-main {
    font-size: 16px;
}
#shiftnav-toggle-main, .shiftnav-toggle-mobile {
    display: block;
}

}

Hope it helps.

[highlandadventuresParticipant]

Hi..thanks for the CSS…it does not seem to work. when i see the page http://www.machupicchu.com/machu-picchu-tours/machu-picchu-amazon-tour/ in an ipad mini portrait mode, the sidebar continues to show on the right instead of dropping to the bottom (like when you see it on a cell phone). please help…as you will notice, the sidebar looks awful on an ipad mini portrait mode. thanks.

[highlandadventuresParticipant]

For example, if you view your page https://theme.co/x/features/100-fluid/ in an ipad mini, you will notice the sidebars pushing below the main content…basically, the mobile display kicks in. where is that setting?

[Paul RModerator]

Hi,

You can add this under 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;
}
}

Change 1024 with the number of when to trigger mobile display.

Hope that helps

[highlandadventuresParticipant]

tks so much…i worked…

[JadeModerator]

You’re most welcome.

[Author]

Posts