- This topic has 12 replies, 5 voices, and was last updated 3 years, 1 month ago by Brian.
June 1, 2017 at 9:07 pm #327519Beau
I am using Lightweight Grid Columns with the latest version of GP and cannot for the life of me figure out how to make some text centered vertically in a 50% width column.
Is there any way to do this?
BeauGP Premium 1.3June 1, 2017 at 11:35 pm #327546TomLead DeveloperLead Developer
Vertically centering content is very difficult in CSS/HTML unless you know the exact height of what you’re centering. Is there a fixed height or is it dynamic?June 3, 2017 at 10:47 am #328137Beau
I keep finding that out! The div would be within a 50% column within one of the sections of a regular static page, so ultimately the height would be dynamic based on the screen width. I suppose I could set the height of the div, which could change based on screen width?June 3, 2017 at 11:59 pm #328264TomLead DeveloperLead Developer
You could try something like this: http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/June 5, 2017 at 7:26 pm #329100Beau
Ya I did see that thanks, but that only works with a static height for the parent element. Do you know of any way I could make the element’s height based on the height of the image in the other column?June 5, 2017 at 11:53 pm #329153TomLead DeveloperLead DeveloperJune 6, 2017 at 6:25 am #329312Beau
Cool thanks Tom!June 6, 2017 at 8:58 am #329388TomLead DeveloperLead DeveloperOctober 11, 2017 at 2:57 pm #401575Maxwell
Any chance of an update to LCG with flexbox?October 11, 2017 at 10:50 pm #401698TomLead DeveloperLead DeveloperSeptember 19, 2018 at 4:36 am #680979Brian
Tried this but it cuts off some of the text when in mobile.
I used http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/ but I couldn’t get it any better. Currently having the problem on https://bttestserver.com/ Could anybody help?
Brian ThompsonSeptember 19, 2018 at 4:41 am #680981DavidStaffCustomer SupportSeptember 19, 2018 at 4:52 am #680993Brian
- You must be logged in to reply to this topic.