Support » Theme: SuperMag » Responsive ajust problem

  • Since the last update I have been having a strange problem. The responsive fit for mobile screens leaves a narrow white band on the right side. I’ve tried all kinds of CSS tuning but I can’t solve it.

    All content fits properly within the visible space of the screen, but this white band remains on the right side (5 or 10 pixels). This causes Google’s search console to report error on mobile features …

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Theme Author Acme Themes

    (@acmethemes)

    Dear jeffmart,

    This is not by theme updates. We found inline code, may be added from Additional CSS or Customization, please remove this code

    @media screen and (max-width: 640px) {
    	
    	#page {
    		width: 95%;
    	}
    }

    If this is added from the plugins or you are unaware of it, you can add following code in the Appearance => Customize => Additional CSS to fix it.

    @media screen and (max-width: 640px) {
    	
    	#page {
    		width: 100%;
    	}
    }

    Note: There are also other codes on media query

    Best Regards!

    Dear @acmethemes

    This customization is already part of the interim solution of the problem. Just after the problem, I added this code in the media query, so things are all inside the viewport. Otherwise the white ribbon is left on the off-screen side, and Google Search Console points out three errors in “Mobile Features”: content larger than the screen, clickable elements too close and text too small to read … I just was able to validate corrections after this workaround, which is far from a definitive solution…

    If I go back to the original query, the problem reappears. And no, I didn’t have this problem before the last update.

    Best regards!

    Theme Author Acme Themes

    (@acmethemes)

    Dear jeffmart,

    The is no any CSS/Styles changes in recent updates. Our findings show the cause of the issue is custom CSS code: 95% of #page width.
    If this is necessary for you, we would like to suggest you edit the code slightly

    @media screen and (max-width: 640px) {
    	
    	#page {
    		width: 95%;
    		margin: 0 auto;
    	}
    }

    The above code doesn’t remove the space but will equal it to left and right sides.

    Note : SuperMag Demo is Mobile Friendly

    Best Regards!

Viewing 3 replies - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.