CSS for looper posts to fill column space

[KEXINO]

Hi all,

I’ve been scratching my head to solve a small CSS issue that I’m hoping you can help me with.

I have created a page that’s pulling in posts from a variety of post categories, using my new favorite feature - loopers.

Everything’s working great, but I can’t seem to be able to style the looper output properly. What I want is for the looper content to fill the column space equally and centered. However the hover effect shows the looper isn’t centralized. See image:

Could someone take a look and let me know where I’ve gone wrong?

Much appreciated.

[tristup]

Hi @KEXINO,

Thanks for reaching out.
It seems that you have added the Hover custom CSS to the inner column, I would suggest you add the same for the parent column marked in the given screenshot.

Hope it helps.
Thanks

[KEXINO]

That was it - I had applied the hover effect too far down in the column hierarchy. Thanks so much.

However I still cannot work out how to the looper post output always fill the column height regardless of how much content is in there (i.e. the example that you’ve highlighted in your screenshot).

Can you point me in the right direction?

[christian]

Hey @KEXINO,

Set the Align Vertical option of the main row that holds the 2 columns to Stretch. This will make the height of the 2 columns the same.

After that, set the Minimum Height of the Columns to 100%

If that doesn’t help, please give us the following info in a Secure Note.

• WordPress Login URL
• Admin username and password

You can find the Secure Note button at the bottom of your posts.

Thanks

[KEXINO]

Nope - that’s not working (especially on mobile viewports).

WP access creds attached.

[tristup]

Hi @KEXINO,

Unfortunately, the given credentials are not working. Can you please check and send it once again.

Thanks

[KEXINO]

Sorry about that. I’ve reset the password and updated the secure note.

[tristup]

Hi @KEXINO,

The base width of the button element is set to the Auto and that is the reason behind your issue, I went ahead and set it to the 100% which resolves your issue.

Thanks

[KEXINO]

Aha! I didn’t think of checking that.

Thanks so much!

[tristup]

Hi @KEXINO,

Glad that we are able to help you.

Thanks