@Bojan Radonic , I need some help to fix this please? -

Hi @Bojan Radonic ,

thanks for help during live chat, can you check these for me please

I need some help to fix this please? - http://monosnap.com/image/krTl6TkdATs7NcZS4cJu5aoT2neUjZ

http://monosnap.com/image/JjhJ74oFqDb70n6SVJvZQKqZg9aJbQ and also do you know how the background content of the page can be hidden ? either through filling rest of page with menu or cutting it off ?

http://monosnap.com/image/z1hmLDejaCNb7R9FolqJOm6vccVleu like limit the size of page when the mobile menu is active or something ? to the max dimentions of the menu ? so it thinks its the end of the page?

domain : http://tinyurl.com/q6vm7mv

Support Access is open
thanks
Tom

  • Bojan Radonic
    • Head of Support

    Hey @Tom,

    Added the code to your custom CSS tab to reduce the padding on links in your navigation to reduce the space between them and also removed those big spaces between menu items. This is what I've added in the same media query used before:

    li a.menu-image-title-hide.menu-image-not-hovered {
        display: none;
    }
    .main-navigation li a {
        padding: 20px 9px !important;
    }

    As for the width of your menu, the whole site width was not good on that resolution because of social icons, I've added CSS to fix that in the same media query as above:

    div.fsi-social-icons-right {
    width: 79px;
    }

    As for forcing your menu to cover 100% of the screen I wasn't able to do this with CSS, if you need this I could include one of our SLS developers for his opinion on this one.

    Best regards,
    Bojan

  • Tom
    • Code Wrangler

    Hi @Bojan Radonic
    thanks very much the menu looks alot more tidy :slight_smile:

    Yes please if you can get one of the SLS guys to take a look at hiding the page content when menu is open on mobile device / small screen or extending it to edge to achive similar effect that would be very much appriciated.

    also i just noticed at the bottom of the screen when scrolling down either on mobile or desktop on small screen size the fotter area has a large black gap? can it be removed /hidden ?
    http://monosnap.com/image/ZKSXoaiWRmR3MIXWvzLaHCNVfBBp9b

    Thanks
    Tom

  • Ash
    • WordPress Hacker

    Hello @Tom

    I hope you are well today.

    Please add the following code in your theme's footer.php:

    <script type="text/javascript">
    jQuery(function($) {
      var obj = $('#menu-main-top'),
          height = obj.height();
    
      setInterval(function() {
        if( $('#site-navigation').hasClass( 'toggled' ) ){
          $('#content, footer').hide();
        }else{
          $('#content, footer').show();
        }
      }, 500);
    });
    </script>

    Hope it helps :slight_smile: Please feel free to ask more question if you have any.

    Cheers
    Ash

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.