Howto Vertical Alignment for the...

User 131545 Photo


Registered User
687 posts

Hello all,

I have already tried everything to get the second map also on a part with flexbox and vertical alignment
but it's really not.
Can someone fix it for me and tell you how that solves the problem
Thank you
Stephane

Here is my example where it goes wrong
Toekomstgerichte door ICT gebeten IT'er
Stephane Fonteyne
Ba. Elektronica - ICT
Application Software PowerBasic Developer
e-mail : stephane.fonteyne@telenet.be
gmail : stephane760126@gmail.com
linkin : in : <http://www.linkedin.com/pub/stephane-fonteyn/53/402/204>
twitter : @Stefke36
User 122279 Photo


Senior Advisor
14,461 posts

I could have fixed it, but this time you have to do it yourself. I can give you some hints about where you go wrong.

1. You are using version 2.5 but posting in the forum for 3.x What do you really want? I have told you before that RSD2.5, with the strict row/column system is out, over, finito! We'll be having SD4 quite soon, so don't get hung up in outdated frameworks! The row/column system always had problems with columns of different height lining up nicely, and floating those columns does not make it easier (I know it can be done, but quite honestly, I've forgotten how).
2. So, start a new project in SD3.5, add a container to the canvas. Call it something like '.card-wrapper', '.card-holder' or 'whatever'. Make it display flex, probably direction column.
3. Add a container inside the first, call it e.g. '.card', make it display flex, direction column. Fill the card with your content (image, heading, paragraph, button etc).
4. Duplicate that card until you have 4 of them.
5 Then move up past the first breakpoint and make your .card-wrapper display row and wrap
6. Adjust the width of the cards, e.g.to 50%
7. At the next breakpoint adjust the card width again, to what you find suitable.

I'll leave the fine-tuning to you, positioning the elements centered, left/right aligned or whatever. You will also need some padding/margins here and there, put them in where you see that they are needed.

If you change your structure to what I have described above, you will save masses of extra, unnecessary and old-fashioned coding.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com



Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.