Problem with Centered View on Mobile

Hi,

I have a small problem which someone from this experienced place can help with.

I have a centered view when viewed from desktop. Screenshot attached.

But I want it to appear full width on small screen devices. But it is appearing centered in mobile view as well. Screenshot attached.

Link to screenshots:
Mobile View: https://drive.google.com/file/d/0B03pzdr-fIDTV0JTU2taM3dNNGc/view?usp=sharing
Desktop View: https://drive.google.com/file/d/0B03pzdr-fIDTS2lVY3B0V25CRGM/view?usp=sharing

Please help.

URL: alkalinedietindia.com

Hi there,

Please try this code in the customizer:

.blog .x-container.max.offset {
    max-width: 100%;
    width: 100%;
}

.blog .entry-wrap, .blog .entry-footer {
    width: 72%;
    margin: 0 auto;
}

Hope this helps.

I’ve pasted the code you gave in the Additional CSS section of the customizer.

But it has not changed anything. What should I do?

Hi There,

Please try adding the following CSS instead:

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