-
shaunkillian
Hi
I am working on a staging site (below). Towards the bottom of the homepage, you will 4 blog archive cards. I created this using a Query Loop. The query loop is in a Block Element set display before the footer.
I am having trouble getting the bottom of the cards to align vertically. The Post Template containers have a height of 100% and the other containers within it have no height settings. See video below.
Can you please help?
I have asked similar questions of over the last few weeks with different staging sites I am working on, and you have kindly told me how to fix them.
As well as telling me what to do, if you could please explain why, it may help me to stop asking similar questions again.
Cheers
Shaun -
Fernando
Hi Shaun,
Conceptually, you just need to set the Post Template Block to display:
flex
– flex-direction:column
.Then, give the last child Block a top margin of auto.
It’s the same as what’s explained here for Grids: https://docs.generateblocks.com/article/vertical-alignment-of-content-in-grid-container/
If you need assistance, could you share admin login credentials so I can show you how?
-
shaunkillian
Hey Fernando
Thanks for that. I tried but I am doing something wrong.
I have put a login link below.
The Query Loop Blocks is in Elements > Before Footer
Cheers
Shaun -
Fernando
Here’s a video tutorial: https://share.zight.com/v1uBjyjj
-
shaunkillian
Thx Fentando
I got it to work on the Before Footer element. But I can’t get it to work on the Blog Archive Card element 🙁
Any ideas?
-
Fernando
Try this: https://share.zight.com/yAuB0LLo
-
shaunkillian
No Lock see https://vimeo.com/913197690/a00c432538?share=copy 🙁
-
Fernando
You haven’t set the height of the Parent Container to 100% yet. Could you set that first?
-
shaunkillian
When I look, I think I did (see image link below).
I know I am probably wrong, but I’m not sure how I am wrong.
-
Fernando
Is that from the Staging site? Could you share login credentials to that?
-
shaunkillian
That’s where the confusion must have been. I gave you the login to the wrong site. Correct login is below.
-
Fernando
Your Blog Page is a static page that has a Query Loop.
To make sure we’re looking at the same page, are you looking at
/news/
? -
shaunkillian
I may have made some bigger mistakes than just the container height. See the last video below in response to your question.
-
Fernando
I see.
Where should the terms be? Should it be on top of the image?
Could you also temporarily disable all caching/optimization plugins in the Staging site while we fix this?
-
shaunkillian
Done
-
Fernando
Where should the terms be? Should it be on top of the image?
- You must be logged in to reply to this topic.