[Mupa]

Which margin/padding do i have to change, so that the space on the left/right side of the whole side is being reduced especially in mobile mode?

[Mahesh]

@mupa: Do you mean for content area in mobile devices? Go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

@media screen and (max-width: 767px) {
    article.hentry {
        padding: none;
    }
}

Regards,
Mahesh

[Mupa]

Hm, this changes nothing. I mean the white space on the left and right side for the whole page in mobile mode.

[Mahesh]

@mupa: Sorry, my mistake, got little mixed up with codes. Use the following CSS:

@media screen and (max-width: 767px) {
    article.hentry {
        padding: 0;
    }
}

Regards,
Mahesh

[Mupa]

This works fine for the articles, but what about the widgets?
And there is some white space left. Is there another “outer” space which has padding/margin as well?

[Mahesh]

@mupa: Go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

#content .wrapper .widget {
    padding: 0;
}

Regards,
Mahesh

[Mupa]

This works perfect except in landscape mode. There you don’t have only one article after another, but two articles side by side without margin/padding.

And second thing: There is a little space left on both sides. Is this a browser issue, or is there another element left with margin/padding? I saw websites where you have a little bit more then no margin/padding on the left/right side in mobile mode. And i want to use as much space as possible, so i need that as as well.

Third thing: Is it possible to show all pictures of articles (preview picture and pictures in articles) with no margin/padding like the header picture or the slideshow picture in mobile mode?

[Mahesh]

@mupa: Use the following CSS:

@media screen and (max-width: 767px) {
    article.hentry {
        padding: 0;
    }
    #page .wrapper {
        padding: 0;
    }
    article.hentry .featured-image img {
        width: 100%;
    }
}

Regards,
Mahesh

[Mupa]

Thanks again for your great support until now. It’s nearly perfect now.
I don’t know if the last thing is possible: I only want the featured images with no margin/padding, the text can have a little bit padding. I tried

    article.hentry {
        padding: 10px;
    }

which makes the article padding perfect, but now it doesn’t matter if

article.hentry .featured-image img {
        width: 100%;
    }

is 100% or not. The padding for the featured image has a padding of 10 px as well.

Is it possible to only give the featured image no margin/padding?

Kind regards
Mupa

[Mupa]

Any ideas? Btw, i bought the Pro version to support the great work of the Catch Themes team.

[Mahesh]

@mupa: Sorry for the late reply. Thank you for using Catch Adaptive Pro. Can you please clarify more with an image as an example.

Regards,
Mahesh

[Mupa]

Please have a look on http://m.sport1.de/us-sport/nba/2016/04/golden-state-warriors-verlieren-ohne-stephen-curry-bei-houston-rockets in mobile mode.
All pictures have no margin/padding except the article text.
It’s important to watch this with a smartphone or Google Chrome in mobile mode cause the site would switch to the desktop version instead.

[Mahesh]

@mupa: Please use the following CSS.

article.post {
    padding: 0;
}
article.post .entry-container {
    padding: 15px;
}

Do you mean to make like this?
Let me know further.

Regards,
Mahesh

[Mupa]

Yeah, this is perfect now for featured images. But is it possible to give images which i have included in an article itself zero margin/padding as well?

[Mahesh]

@mupa: I’m afraid this is not possible.

Regards,
Mahesh

[Mupa]

One question regarding that topic:
Is it possible to just increase the bottom padding/margin of the Featured Slider? Otherwise i have no space between the Featured Slider and the image of the last post if i open the site with a smartphone in portrait mode.

[Mahesh]

@mupa: Please use the following CSS:

@media screen and (max-width: 400px) {
    #feature-slider {
        margin-bottom: 20px;
    }
}

Note: Adjust the margin-bottom as per required.

Regards,
Mahesh

[Mupa]

This works perfect, thanks a lot.

[Author]

Posts