Flex container issues

[CraigR]

I'm a n00b with the software and trying to teach myself. I have downloaded a free template from this site to use. I edited the index page and looks fine on a computer in a browser. However when I check the 320 view nothing but the text adjusts. The heading and my pictures do not. I have tried to manually adjust them and they won't shrink and they snap right back if I try to move them. I have also hidden them and brought new image and header in and I still can get them to look right when previewing it. In the past week I have read and watched a bunch of videos on the software and yes I did read the section on flex containers. I'm just not getting it. Here is a link to download my project. https://docs.google.com/document/d/1m3D ... ue&sd=true

[Pablo]

First note that a 320 is not very useful. Because most mobile devices have a larger view port.
I suggest to use 480 or 768 instead.

What is the exact purpose of the breakpoint? What would you like to change in this view?

It's important to understand that when using flexbox that the layout is controlled by the grid in combination with the flexbox properties.
So for instance, if you want to show the cards in the products container vertically. Then you will have to adjust the flexbox properties of the cards. For example, flex grow/shrink: 1, flex basic: 100%
Also, all objects should be part of a (flexible) grid, otherwise they will have a fixed/absolute position and overlap flexible content..

If you are not familiar with flexbox, then it may be easier to use layout grids instead, where this functionality is automatic.

If you need further assistance then please remove everything for the project that is not relevant to your question so it is immediately clear what you are trying to do.

For further details about how to share a project file, please see this FAQ:
viewtopic.php?f=10&t=82134

[CraigR]

Thank you Pablo. Maybe I'm just too old to learn something new. I have went over most all the tutorials several times but I find several of the pictures to be out of date because they do not look like what is in the newest version and although I can figure it out it take up much more time. I can't even find any up to date video tutorials I would gladly pay for. Everything I could find is years/versions old.

[Pablo]

I have recently updated many of the tutorials. However, the software keeps being improved weekly, so I do not always have time to update the documentation instantly.
Although the basic concepts of flexbox are still the same. Also, this is not specific to WWB. Flexbox is standard HTML functionality.