Adding s-flow-down to the custom class of the container worked perfectly! Thank you @tav, @habitualshaker and @Webdeersign!
One more quick question (please forgive me…I’m still learning how to use Source properly) for Stuart:
I’m using Joe Workman’s Equal Height stack to make tiles, and I want the content in the tile to be vertically centered…I can’t seem to get all of the content to be aligned vertically, though
Here’s the page: https://surreyschoolsone.ca/teachers/
Is there a way to do this?
Can you not just use the Source Grid stack to create your tiles? The grid items in that are all equal height by default.
Not any more you are. Those days are over.
That’s great!
I removed the Equal Height stack but I’m not getting equal height tiles…
There’s probably a setting that I’m overlooking…
Leave the Block Align setting to ‘Fill’ in the parent grid (that’s the default but you must have switched to ‘center’). Then you can use the alignment options in each grid item to set the vertical alignment.
I’d be very interested to learn how to do pure CSS nested equalisation as per many card layouts without the use of JS?
Thank you Stuart! So I’ve got the content centered now…but the turquoise tile doesn’t fill the entire space.
This is how I have it set up:
Markdown stack inside Container Plus stack (Container Plus stack has the background gradient)
Container Plus stack inside Grid Item stack
Grid Item stack inside Grid stack
How do I get the Container Plus stack to fill the entire space?
Take the content out of the Container - the container is not needed. Do this for all items. You can apply a background on each grid item (if they are all the same then you should set this up using a Container Base stack as this can then be applied to the grid items).
YOU ARE AWESOME! Thank you, Stuart! I’m still getting used to Source, but I’m loving it!
