Blog posts show up in two columns on wide screens, one column on small screens.
Custom post types show up in one column at all times. I want them to show just like blog posts–two columns on wide screens, one column on small screens.
Any link to any example page so I can see what is going on in the CSS?
Thanks, Alexander.
Here’s a standard blog post list showing as you wrote the theme. It shows in 2 columns on wide screens and drops to one column on mobile-sized screens. http://dev.iampariah.com/iampariah2014/blog
I got this custom post type archive to float into 2 columns with the following CSS in the child theme (the .webinars comes from the content.php <article id=”post-<?php the_ID(); ?>” <?php post_class(‘group’); ?>>):
.post-list .post,
.post-list .webinars {
width: 50%;
float: left; }
}
That shows in two columns, but when the browser narrows to mobile size, it STAYS as 2 columns instead of going to 1 column. http://dev.iampariah.com/iampariah2014/webinars
Try adding this as well:
@media only screen and (max-width: 719px) {
.post-list .webinars { width: 100%; }
}
Or in full:
.post-list .webinars { width: 50%; float: left; margin-bottom: 40px; }
@media only screen and (max-width: 719px) {
.post-list .webinars { width: 100%; }
}
Hi there Alexander!
I had the same issue using CM Tooltip plugin I was able to fix it with your suggerence, great!
There’s still a problem. The excerpt for Custom Types seems to not get truncated at all, it shows the full content of the glossary term entre. That makes the post list look ugly.
Do you have any tip about how could I address that?
Thanks a lot!