Background/border appearing on mobile devices

  • I wonder if somebody can help with this please . . . my Penscratch2 site has a niggling problem that I cant seem to figure out. The mobile version of the site shows a thin border of the grey background making the page narrower (this also happens on a tablet/ipad although not quite so important in that case). Other Penscratch sites don’t seem to have this issue, an example is: https://adriennecraddock.com I have a feeling I have done something that has caused this border to appear but I can’t work out what, any help would be much appreciated.

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

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi there,

    The site at https://adriennecraddock.com/ uses the original Penscratch theme. That’s the version you’ll get if you download it directly from https://www.ads-software.com/themes/penscratch/, or via the theme showcase in WP-Admin, but I wouldn’t recommend it, as this version of the theme isn’t being maintained any more.

    You’re using the updated version of the theme called Penscratch 2, which can be downloaded from the WordPress.com theme showcase, or installed via Jetpack. The border you see is something that was added in Penscratch 2, so it’s not something you did – it’s how the updated version of the theme was designed.

    But you can remove that on the mobile and tablet view with this CSS:

    @media screen and (max-width: 50em) {
	.site {
		margin: 0;
	}
}

    You can also just make the border narrower by adding a smaller value for the margin instead – the default margin on smaller screens is 14px.

    Thread Starter clive57

    (@clive57)

    Thanks, thats great, much appreciated! . . . I just feel the border on the mobile makes the page look too narrow in the normal portrait view. That code works a treat, thanks again.

    Happy to help ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Background/border appearing on mobile devices’ is closed to new replies.