[Resolved] Adding top padding to my search results view that's using Bootstrap 3

[Author]

Posts

[JasonW6419]

I'm trying to add padding to my search results View. Toolset is set to load Bootstrap 3. I am using 2 columns and the auto spacing between the two columns is fine. If I could add that same size spacing for the rows too, that would be great. I've tried multiple ways to add padding in the Loop editor and the Template sections. Nothing seems to work, even after caching browser and WP, disabling plugins etc.

I'm using Hello theme from Elementor and using Elementor as page builder and loading the View into an Elementor page using the Toolset integrated widget. There hasn't been much documentation I could find on manipulating the CSS of the grid except for one video I found that puts <h4 > tags and <p> around the loop items in the template section and adding CSS code to the CSS editor below. I've tried to add a <div> class around the loop item, which is just an image pulled from a toolset custom field, and add CSS in the editor below to give it a top-padding, but it didn't work.

Any suggestions would be great. I'll attach pictures of my View's code and Template along with what the front-end output is.
My site is currently not live.

[Minesh]

Hello. Thank you for contacting the Toolset support.

Basically, you can add the custom CSS to your view from the "CSS editor" section of your view's "Loop Editor" section.

To add a top or bottom margin/padding to your row, you should add the custom CSS class to the "CSS editor" section and apply that class to your row.

Please check the following link that may help you:
=> https://stackoverflow.com/questions/10085723/twitter-bootstrap-add-top-space-between-rows

[JasonW6419]

HI Minesh,

I still can't seem to get the padding to show. Where exactly would I put the code? I looked at the link you sent and was trying to follow the most accepted answer which was to use:

<div class="row top-buffer">

and then adding the margin/padding in the CSS editor below.

Where exactly should I add this code? I put the "top-buffer" after "row" on Line 6 in the above Screenshot and added the CSS targeting the buffer, but that didn't work. I cached WP and browser to make sure it wasn't that, too.

Thanks so much, sorry I'm noob.

[Minesh]

Ok - can you please share the problem URL where you added the view and admin access details.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.