Support » Theme: Basic » Menu covers header image when viewing mobile device

  • Resolved recoil9

    (@recoil9)


    I just installed latest WordPress 4.6.1 and installed Basic theme. I updated theme to latest version and it looks great on desktop.
    But when I view in mobile device the drop down menu covers the header image.
    I used the suggested header image size.

    Any idea what else can be done to fix this? The header doesn’t resize in portrait mode either. Seems ok in landscape. Samsung Galaxy phone.

Viewing 5 replies - 1 through 5 (of 5 total)
  • lisa

    (@contentiskey)

    can you share a link to your website?

    http://tinyurl.com/htjkb43

    The header image has 2 lines of text on each side of header. When viewing in desktop only top half of header shows.

    On mobile, menu covers part of header.

    Thank you for your help

    • This reply was modified 2 years, 11 months ago by recoil9.
    Theme Author WP Puzzle

    (@wppuzzle)

    Hello!

    Add this CSS code in menu Appearance → Customize → Custom code in block Custom styles:

    
    #header { background-size: 100%; }
    .topnav {
    position: relative;
    top: 52px;
    }
    @media screen and (min-width:768px){
    #header{min-height:130px; }
    .topnav { top: 120px; }
    #main{ margin-top: 52px;}
    }
    @media screen and (min-width:1024px){
    #header{min-height:180px; }
    .topnav { top: 170px; }
    }
    @media screen and (min-width:1200px){
    #header{   
     background-size: auto;
     min-height: 200px;
    }
    .topnav { top: 180px; }
    }
    

    Works great. Thank you so much. Love the design and layout.

    Theme Author WP Puzzle

    (@wppuzzle)

    Excellent! We are glad that we were able to help.

    We will be very grateful if you vote and add review to our theme Basic on WordPress https://wordpress.org/themes/basic/

    How to add review?

    On page of theme Basic in WordPress directory click button Add review (it is necessary to login or register on wordpress.org)
    http://wp-puzzle.com/wp-content/uploads/2016/07/add_review.jpg

    Thank you for choosing our products!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Menu covers header image when viewing mobile device’ is closed to new replies.