Post Module Responsive Problem

Hi guys,

I’m not great at css so I’m having trouble making the “From the Blog” section on my test site responsive. Here is the link http://riolifechurch.org/demo/.

It looks fine on my desktop and my iphone. However, on my ipad i have trouble.

I want the 3 posts to be responsive at any screen width. Right now on my iPad2 when i’m on portrait mode it shows 2 posts on top and 1 post at the bottom. I’d like to have all posts in a row, going up and down when in portrait mode. Just like on iphone.

I’m using the beaver builder theme and this is the posts module. I’m also using css hero but I still can’t figure out how to fix the problem. Like I said, i’m not great at css.

If anyone can help me I’d appreciate it.

Oh and I already tried messing with the paddings on the row and module.

Thank you in advance,
Luis

Hey Luis,

Thanks for getting in touch! The Posts Module is already responsive which is the reason why the third block goes down since it wouldn’t fit on the screen anymore, it just doesn’t do well with your specific layout. Using CSS to position the elements will be quite tricky as well. I would suggest reducing the width of the posts via the Posts Module just enough to make all three of them fit on one row.

Ben