www.wysiwygwebbuilder.com

I used the Flexgrid layouts and thought I placed the objects within the layout. When viewed on a smartphone it turned out some objects were not flexible. How do you change an objects properties from not flexible to flexible?

I found the enable "responsive fonts" for text and read the basic tutorials.

You can use the 'flexbox' propertie' to change the behaviors of object inside a flex grid or flex container.


For example set the flex grow / flex shrink to: 1 to make it full width.

See also this related tutorial:
http://wysiwygwebbuilder.com/flexbox.html

I tried this. It did nothing to align the Text and other objects with the Flex Grid. The text did move but not with the Flex Grid. It also did not align as the tutorial says it will. Choosing center, flex start, flex end honestly did nothing when you shrink the page down to 320 or even smaller. The headers , Flex Grids and text just are not aligned and running within similar parameters. It looks great at 16:9 format. However, that is useless as professional websites adjust properly when viewed on the phone.

I'm thinking of redoing the whole website. Trying to work with the myriad of problems with the pages is time consuming. I have hundreds of pictures and can import objects from the other website. So using a couple templates for menus and pictures could be the more basic solution.

If you are not familiar with flexbox then I recommend to use layout grids instead. Using the flex grid requires some basic understanding of the flexbox concept.

There might also just be too much on some of the pages. I am studying other websites and how they adjust on phones. When you view them on phones the pictures seem to have fewer "objects" (text etc.) and move the view to a downward scrolling experience with one picture to view at a time.

Maybe the example template will be helpful to get you started?
http://wysiwygwebbuilder.com/templates8.html