0
Welcome Guest! Login
0 items Join Now

hidden-tablet media query issue

  • hidden-tablet media query issue

    Posted 10 years 3 months ago
    • Hi,

      I have created a module that sits in 'sidebar a' with the module class suffix of 'hidden-tablet'. There is only one module. However, when I turn the tablet to portrait (or shrink the website to tablet site) the module disappears, but the grid still appears as an 8|4 ratio. I want the module to disappear and the grid to go to grid-12.

      I can't share the site as it is only being used on a local setup at the moment. Any ideas on what might be causing this? or where I should investigate?

      Other info:
      Using responsive layout, mainbody with with sidebar, gantry is up to date, using the gantry theme.

      Any help or guidence massively appreciated.

      Thanks

      Dan
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: hidden-tablet media query issue

    Posted 10 years 3 months ago
    • StrawberryWoo wrote:
      I have created a module that sits in 'sidebar a' with the module class suffix of 'hidden-tablet'. There is only one module. However, when I turn the tablet to portrait (or shrink the website to tablet site) the module disappears, but the grid still appears as an 8|4 ratio. I want the module to disappear and the grid to go to grid-12.

      It depends on what Tablet screen resolution you have at portrait, normal or large tablet, and what the template mediaqueries are being called.
      Use Chrome Developer Tools to inspect the module and see what the mediaquery is.

      It should be one of these:
      /** Tablet Modes **/
      @media only screen and (min-width: 768px) and (max-width: 959px) {

      }
      /** Tablet-Large Modes **/
      @media only screen and (max-width: 1199px) and (min-width: 960px) {

      }

      The other option is that it sounds like you probably don't want the module to appear in mobile mode either so why not kill two birds with one stone and just use "visible-desktop".

Time to create page: 0.052 seconds