[Pro] reordering responsive items

I’m moderately good at responsive layouts in Freeway but this issue has me stumped.
I have 3 items, all html inline items, containing a combo of text and graphics. At full width, the 3 items, I’ll call them 1, 2 and 3, are side by side, in that order, 1, then 2, then 3.
But at the breakpoint for a phone, I want them to stack. That’s been no problem for me. But they stack according to the main layout, 1 on top, then 2 below then 3. But I want item 2 on top, then 1 then 3. If I drag the items around that screws up the previous layout. Is there a method to do this?
My fall back is to make a second copy of item 2, and hide it until the narrow layout, then hide the first version of item 1 and reveal the second where I want it. I know that works but it means I have to remember to update 2 items every time I make a change to that one item. Can anyone help?
Thanks

Brian


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Hi there… you can go to the breakpoint you want to customize and copy paste each wrapper where you want them placed… and then delete accordingly Thats how I was taught… good luck


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

I must be missing something with your instructions. As soon as I copy one of the elements, then paste it into another spot then delete the original, all the layouts are affected accordingly. It’s the same problem with dragging the elements around. Or maybe I’m missing something in your explanation? Can you clarify further?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

hmm sorry thats how i do it … lets see if someone more knowledgeable chimes in…
sorry


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Flexbox.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

What is flexbox, and where do I get it

Sent from my iPhone

On Jun 23, 2017, at 4:27 PM, Richard van Heukelum email@hidden wrote:

Flexbox.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Flex box isn’t something you get, it’s part of modern CSS , I have an example of what you are trying to do so if you can wait until the morning then I can post the freeway example . Kind regards max


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Thanks!

Sent from my iPhone

On Jun 23, 2017, at 5:15 PM, max email@hidden wrote:

Flex box isn’t something you get, it’s part of modern CSS , I have an example of what you are trying to do so if you can wait until the morning then I can post the freeway example . Kind regards max


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

I’m thinking about creating styles of each flex box reference and save them in a freeway template, after that it’s just applying the appropriate styles to the HTML-items …

– Richard


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

sorry its taken so long but I’ve been away for a lot of the weekend

anyway here it is

basically you apply the display:flex to the container so in my example its just the outer box called:container
just click on extended and in the div style tab use: display in the name field and: flex in the value field
then if you notice if you click on box 3 called item3 you will see that it has a changed media type at Tablet:768

Just view the artwork at that size, so click on Tablet:768 on the Bar just under: Master Page Preview and Link Map Tabs.
Then whilst the item is still selected click on Item/Extend then click on the div style tab and and :order in the name field and -1 in the value field.
Save and then publish. What this does is position Item 3 at position 2 because we have asked it to go back 1

I hope this all helps Kind regards Max


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

That sounds great Max thanks very much! I’m away myself for a few days now but I look forward to looking at your solution as soon as I return. I appreciate the help!
Brian


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options