Archived topic
Change table-grid- and mobile-grid- Class Value on Post Archive
3 replies · Started by Arthur on June 5, 2019
I noticed that the grid-25 class is added to the post_class when selecting Display Posts in Columns and selecting 4 for the number of columns. I also noticed that the tablet-grid-50 and the mobile-grid-100 classes were added as well.
The grid-25 class will change based on the number of columns selected in the Customizer.
Is there a way to change the tablet-grid- and mobile-grid- values as well?
Hi there,
We can use some CSS to overwrite. For example:
@media (max-width: 1024px) and (min-width: 768px) {
.tablet-grid-50 {
width: 33%;
}
}
Adding CSS: https://docs.generatepress.com/article/adding-css/
Let me know if this helps :)
That should work. I was wondering if there was a hook I could use to modify the output.
Also, when writing out @media queries, does it matter the order of (max-width) and (min-width)? Can I write this with (min-width: 768px) before (max-width: 1024px)?
I was wondering if there was a hook I could use to modify the output.
Not yet but we are hoping to implement a filter for it.
Also, when writing out @media queries, does it matter the order of (max-width) and (min-width)? Can I write this with (min-width: 768px) before (max-width: 1024px)?
I think it should work both ways - doesn't hurt to give it a shot.