Flexgrid Content NOT Visible

[Smee]

Now that I have a breather, I'll take the time to show what is the problem with the flex grid.

When I downloaded your example, it works perfectly. When I place a flex grid on the page (using either the default configuration, choosing a template, or building from scratch) I get one of two things. Sometimes I get a page that only Picasso could understand, or I get absolutely nothing.

I posted one example a couple days ago. To refresh:

This is how it looked in WWB:

And this is how it looked in browser:

Currently experimenting with this file: http://www.ahgweb.com/wwb_14/flexgrid_notworking.wbs

When previewed in Firefox and Edge nothing in the flex grid appears.

If I try it in Internet explorer, I at least get something ableit the page is not usable.

Been through the tutorial a couple of times, but must be missing a step somewhere.

[Pablo]

First note that Internet Explorer does not support CSS layout grid, so it will not work in IE.

Also:
- flex grids do not work with master pages with layers combined.
- you have added breakpoints, but the flex grid layouts in the breakpoints do not have anything in common with the default view. So, therefor nothing will show in breakpoints.

To make your project work:
- remove the layers from the master page, make sure all content is 'flexible' (layer are mainly for absolute positioned content)
- remove the breakpoints or make sure the settings make sense.
- do not use 'center in browser', this makes the page width fixed
- remove fixed content like Title1, Description1, because it affects the view port size in smaller views.

Tip: Do not use too much difference layout method on the same page (layer, layout grid, flex grid, master pages, absolute positioned objects). Not everything can be mixed together.

[Smee]

First note that Internet Explorer does not support CSS layout grid, so it will not work in IE.

I knew that, that is why I tried as I was getting nothing in the browsers that are supposed to support it.

Also:
- flex grids do not work with master pages.

THAT is likely where the problem is then. Looked in tutorial and could not find that information. Now I know.

Does that then mean that this is best used for single page sites ... as reconstruction of the header on large sites could become quite time consuming?

Thanks.

[Pablo]

To make your project work:
- remove the layers from the master page, make sure all content is 'flexible' (layer are mainly for absolute positioned content)
- remove the breakpoints or make sure the settings make sense.
- do not use 'center in browser', this makes the page width fixed
- remove fixed content like Title1, Description1, because it affects the view port size in smaller views.

Tip: Do not use too much difference layout method on the same page (layer, layout grid, flex grid, master pages, absolute positioned objects). Not everything can be mixed together.

[Smee]

I do use layers as a spacer to keep the first layer off of the absolute top of a page. and the absolute bottom of a page. Inside of layers though, I usually use a transparent shape as a spacer.

[Pablo]

Why not use margin?

[Smee]

Why not use margin?

I've been looking for "page" property, didn't think to look at object arrange. Thanks.

Sometimes figuring out where to look is half the battle.

[Pablo]

Margin is also available in the context menu (right click) or via the Property Inspector.

[charles m]

Hi Pablo


Just following on from this thread.
We are building a website using Flexgrids - one of the main selling points for WYSIWG - to create a flexible website between different browsers and screens sizes.
Am I right in saying this will now not work on IE at all?.... If so is this a problem on other browsers and is there a solution?

[Pablo]

You are correct. Flex grid will not work with IE. IE is no longer maintained by Microsoft so it does not support newer HTML/CSS functionality.
https://caniuse.com/#feat=css-grid