Docs

[mathijs84]

.home .x-recent-posts > a {
    height: 207px;
    overflow: hidden;
}

This gives problem on mobile because we then need more room to make the text visibile!

[Jade]

Hi there,

Please update the code to:

@media (max-width: 767px) {
    .home .x-recent-posts > a {
        height: 207px;
        overflow: hidden;
    }
}

Hope this helps.

[mathijs84]

Hi,
NOw the code doesnt seem to work anymore!

[Jade]

Hi there,

Please update the code to:

.home .x-recent-posts > a {
    height: 207px;
    overflow: hidden;
}

@media (max-width: 767px) {
    .home .x-recent-posts > a {
        overflow: visible;
    }
}

Hope this helps.

[mathijs84]

Updated, but if you check on mobile is still doesnt look good

See attached screenshot.

Maybe we can limit the amount of words on mobile?

[Joao]

Hi There,

I have tested your blog on my Android Firefox and it is loading fine,

What device and browser you are using while experiencing the issue?

Thanks

Joao

[mathijs84]

On my iphone, you can see the text is not really nicely broken off..

See attached file

[Lely]

Hi There,

Please update the code to this:

.home .x-recent-posts > a {
    height: 207px;
    overflow: hidden;
}

@media (max-width: 767px) {
    .home .x-recent-posts > a {
        overflow: visible;
        height: initial !important;
    }
}

On mobile or smaller screens, the container width becomes smaller thus needs more height to accommodate the text height. Above CSS reset the default height that is set on large screen size.

Hope this helps.

[mathijs84]

PERFECT!!!

[Christopher]

Glad we could help you with this.

[Author]

Posts