0
Welcome Guest! Login
0 items Join Now

Menu-structure mobile

Last Post
Search Topic

  • Menu-structure mobile

    Posted 9 years 1 month ago
    • Hi,

      On b-art3dprint.rcwebdesign.be/nieuwewebsite/ the Chimera template is used.

      Checking the website's responsive design for tablet, I saw the side-bar menu isn't visible.
      On that point the toggle-menu isn't visible, that's visible on a phone.

      I looked into the css, but didn't find a solution yet. Could you please help? On tablet the side-bar should be visible.

      Other question, not related to this website. When in the template manager the menu-control is on, and the main menu is selected, all the menu-items in it are displayed. However, sometimes I need some of those menu-items not in that menu on desktop. That's why I put them in a second menu. However, when using 2 or more different menu's on the website, only the main menu is visible in the toggle-menu on phone. How can I make it work so that all menu-items are visible in the toggle menu, and some are invisible on desktop (or placed in different positions, e.g. header, side-bar and footer on desktop)?

      Thanks already for your answers and assistance.

      Kind regards.

      Rob
    #1180358
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: Menu-structure mobile

    Posted 9 years 1 month ago
    • Actually they are visible - it's just that they are white text on a white background. Also, they moving off that green background you created. That solution it not going to work (applying background image to body of page) in a responsive template - you need to use multiple background images if you want to do that sort of thing (putting the green background on the menu-block).

      You can use media queries to make certain CSS apply at different viewport sizes - you might need to emply this technique for that design in order to control the positioning of things in different viewport sizes.
      /* Smartphones */
@media (max-width: 480px) {

}
 
/* Smartphones to Tablets */
@media (min-width: 481px) and (max-width: 767px) {
 
}

/* Tablets */
 @media (min-width: 768px) and (max-width: 959px) {

}
   
/* Desktop */
@media (min-width: 960px) and (max-width: 1199px) {
   
}
    
/* Large Display */
@media (min-width: 1200px) {
    
}



      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    #1180697

Time to create page: 0.058 seconds