Archived topic
Help with flex grid containers
5 replies · Started by George on November 16, 2022
In the single post example I have the post meta laid out as a flex grid with 3 containers for author image, author name and published date. On mobile, the published date wraps to a new line but goes over the post author image. Is there a way to have the published date fall below the author name (Written by...)? I can't use responsive settings here because of the flex nature of the grid.
Hi George,
Will the Author image widths be constant? If so, how about adding left padding equivalent to the width of the Author image to the Container of this column on mobile view? Does this work?
Author image will be constant but the image width is too big to be used as padding between items. There will also be another post meta set as a custom field for when the post has a reviewer so I can't afford to have such a large padding space. And, as I said, I am using flex since I want items to wrap to a new line when there is no space to fit them in one line.
Hi George,
the Post meta would need to be wrapped in its own grid, you can then stack that grid on mobile.
Yeah, that sounds good, my mind was stuck there for a minute! Thanks, David and Fernando.
Glad we could be of help
