How do I get rid of the background margin thing on the right and left of my blog articles when on mobile devices?

Support
#1

Hi there

How do I get rid of the background margin thing on the right and left of my blog articles when on mobile devices?

See the right and left of screenshot.

Also, how would I adjust the margin or padding of the text, (distance from the edge) for mobile only? To make text go more toward the edge of the screen?

Thanks
R

#2

Hi There,

Thank you for writing in, please add this to Theme Options > CSS

@media (max-width: 767px) {
	.x-container.max.width.offset {
		width: 100%;
	}
}

The content/text will just follow through when its container has the added space.

Hope it helps,
Cheers!

#3

Hi there, I added the code. It appeared to do nothing.

When viewing our blog posts on mobile devices you still have that gap on the right and left side with the paper effect.

What is the correct way to get rid of this?

(Just on blog posts).

#4

Hello @medzy1,

Thanks for updating tread. :slight_smile:

Can you please share website URL for us to take a closer look?

Thanks.

#5

Select any blog post from www.yotelecom.co.uk/blog/.

Another strange issue is that randomly overnight most of the text on my website has become italics. Without us doing anything.

Can you look into that aswell.

My login details were privately posted on the other thread I have open.

Thanks

#6

Hi there,

I can’t seem to find the login details that you have posted but kindly check in X > Theme Options > Typography > Body and Content and set Body Font Italic to off.

Hope this helps.

#7

Hi There,

That is already off. Can you please let me know how to overcome this ASAP.

Thanks

#8

Also, please let me know about the blog post sides as I asked above. You didnt reply to that part of my comment.

#9

Hi there,

Please provide your admin details in a secure note so that we can provide you some suggestions.

Thank you.

#10

Hi there,

Secure note above has the details for you.

#11

Hi there,

Please carefully copy the code provided as the previous code did not work because the code you used it:

@media (max-width: 767px) {
  . x-container.max.width.offset {
    wisth: 100%
  }
}

This will not work because there is an unecessary space in . x-container and you placed wisth instead of width.

It should be

@media (max-width: 767px) {
    .single-post .x-container.width {
        width: 100%;
    }
}

You could try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Let us know how it goes!

#12

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.