-
Hello,
I am trying to center content on the first section that appears in the link below but cannot. It is slightly off to the left. The section has two columns, with text on the left and a video embed on the right.
I tried to play around with the flex, flex-inline, etc.. but cannot get the alignment to work.
What setting changes would you recommend?
Thanks!
-
Hi there,
it is centre, its just that you have 2 x 50% wide columns and the right hand column requires less space then the left. So what you could try is:
1. select the Container Block that has the Max Width, and reduce that value to eg. 800px
2. edit the Grid Columns to 65% and 35% to balance out the two sides -
Hello,
Thanks for your prompt response.
I had tried to change column size but I cannot find a place to set column sizes to 65%, 35% respectively. Instead I edited “width” under “sizing” for each individual column as 65% and 35% respectively. I did change the section width to 800px as well.
Does not seem to do it.
is there another place where I can set column size? Thanks a lot.
-
Ok.
So the 2 columns you set the Width on.
Go to the Layout > Flex Child and there you will see thebasishas been set to 50%. Remove that value. -
Great. That did it thank you very much.
If there is an article on the difference between flex, flex child, flex inline, etc.. and how to use them could you kindly forward? As it is always a trial and error situation when I use them.
Thanks.
-
Theres quite a lot of documentation online regarding the CSS flex system.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flexible_box_layout
And here’s a good guide:
- You must be logged in to reply to this topic.