Site logo

Archived topic

Simple question re. vertical alignment

7 replies · Started by Timothy on May 17, 2021

Viewing posts 1–8 of 8

How can I get the paragraph text in these containers to align at the bottom of the respective containers? The structure is:

GRID --> CONTAINER --> PARAGRAPH

Don't know why the image is not displaying??
http://meekerhollow.net/gp/vertical.jpg

Hi there,

Can you link us to the page you're working on?

Normally, we can bottom align HTML elements using margin-top: auto; or by using flexbox alignments but we'd like to inspect the site to give the most appropriate CSS write up. :D

Let us know.

Thanks for the response. It's actually a "private" site but I'll recreate and link to what I'm seeing on a test site when I get back to the computer.

Let us know when it's up so we can inspect it. :D

You can use the private information text field to provide the site details. Only customer support team members can see information placed in it. :D

Ok, here's a simple page showing what I want to do, mainly align the paragraphs to the bottom of their respective containers. Apologies in advance if I'm missing something simple but I can't find any way to do this with any alignment of padding options.

Of course it may be a case of there being a better way of accomplishing this other than a container/paragraph approach. (?)

Here are a few questions:

Is the paragraph the sole content of the column? If yes, the vertical alignment dropdown setting of the Grid block and its containing columns should align the paragraphs to the bottom of the column. This is basically us setting the columns to set align-items: flex-end;

This isn't going to be noticeable if the column's height isn't significantly larger than its content paragraph.

Is the paragraph going to have other contents with it? Will the paragraph be the only one to be aligned on the bottom of the column?

If yes, you can set the container column to display: flex; and then add margin-top: auto; to its paragraph block contents so it gets pushed down to the bottom by the top auto margin.

Thanks for the input Elvin. It's in a very early stage of flushing out some designs working with some folks with no experience with GP or for that matter WP in general. I understand what you've described and should be able to pick up from there.

Good to know. No problem. Let us know if you need further help. :D

This archived topic is closed to new replies.