Skip Navigation

[Resolved] Bootstrap Grid column sizes in a View of Related Posts

This thread is resolved. Here is a description of the problem and solution.

Problem: I'm trying to use a 3-column grid to display results in a View, but I want the columns to be equal widths. Right now if only two results are found, two of the columns are very large and the third column is very small.

Solution: In the Loop Wizard, be sure to select Bootstrap Grid as the output style. In this case, it appears a table was in place instead of the BS grid.

Relevant Documentation:
https://toolset.com/documentation/user-guides/digging-into-view-outputs/

This support ticket is created 5 years, 6 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

Tagged: 

This topic contains 2 replies, has 2 voices.

Last updated by Pete 5 years, 6 months ago.

Assisted by: Christian Cox.

Author
Posts
#1305945

Hi there,

On this test post: hidden link

Right at the bottom we have some related posts, just 2 are showing.

Now I have set the bootstrap grid to 3 as this is the default amount I wish to display. There may be the odd occasion when only 2 display however how can I keep them to a 3 grid setup? They should display smaller if in a 3 grid display, at the moment they are way too large.

Also, where is all this additional styling coming from?
The grey background, the border etc.
I can see the CSS and can set it to display: none however where is it coming from? Is the Toolset adding this for some reason.

Thank you 🙂

#1306001
Screen Shot 2019-07-31 at 2.38.01 PM.png

Hi, when I visit this page I don't see a Bootstrap Grid, I see a table or a table-based grid. Those behave quite differently from Bootstrap Grids, and aren't as easily responsive. The extra styles you see are from your theme, and applied to the table elements (see the screenshot). So if you want to use a Bootstrap Grid, you'll have to rework the Loop of this View using the Bootstrap Grid setting in the Loop Wizard. Then since the Bootstrap Grid doesn't use tables, those extra styles should not appear.

Let me know if you have questions about using the Loop Wizard to set up a Bootstrap Grid.

#1306021

Thanks Christian,

Right you were, I thought I'd used a bootstrap grid as I was following a Toolset video on how to do this...I must have set this wrong, Recreated the view and all good now. Thank you 🙂