layout grid on master page covers layout grid on content page

[benkn]

I have a master page (or frame, Ive tried both, same result) with a layout grid serving as my header.

On my content page, I have a layout grid. Right now my content is just text, but that might change so I am hoping to keep layout grid in place.

PROBLEM: The header always covers some part of the content, though it varies per screen size.
How to I get the layout grid to lock to the bottom of by 'master' header?

I have tried content place holder using master frame, which seemed to produce the same result
I have the master set as fixed/header, though i have played with many other settings (on both pages/elements).
(Note: my master also has a footer/floating if that matters. Which is another layout grid (all columns removed) footer floating. The footer seems to perform as it should)

This a clean rebuild of an existing site, so I cant really publish an example, sorry.

[crispy68]

If your header is fixed, simply add a top margin equal to the height of your header on the 2nd layout grid.

[benkn]

That margin would be like 100+ pixels. Also, it seems to change as the screen size changes.

Buffering the top 100 pixels might not work. I also dont know how it would perform as the site gets bigger or if I alter content.

Thanks, though. I will fiddle with it. It might be the perfect solution, Ill try it.

[benkn]

So I added padding tto the layout grid on the content page. (133 to the top)

It works perfectly, until i hit my breakpoint right now set at 600.

Then my grids go vertical and stretch out. the problem is then reproduced.

I am hoping to get the content grid to snap below the master grid.

[Pablo]

In HTML, a fixed elements does not affect the layout of other elements.
That is why you will need to add a margin (not padding) to the first floating element.

If you need further assistance then please share a demo project so I can see what you have done.

[benkn]

Where would I add a margin on a layout grid?

Is there an easy way to share a demo? I have an existing (non responsive) wysiwyg site, and cant publish same names and things named master.

[Pablo]

You can set the margin via the Arrange menu or the Property Inspector or via the context menu (right click).

[crispy68]

That margin would be like 100+ pixels. Also, it seems to change as the screen size changes.

Trust me. I would not advise you of something if it didnt work. I use it myself. Adding margin will not affect anything. Do not worry how it looks in the workspace. All the margin is doing is positioning the 2nd layout grid below your header. If the header changes in size, then change the size of the margin in the breakpoint for the 2nd layout grid.

[benkn]

Thank you Pablo and krispy.

Your suggestions all worked and solved the problem.

When i hit both layout grids breakpoint (600 right now), this margin needs to be adjusted. Now things are vertical. I think I can math out the margins on the next breakpoint, as krispy suggested.

I am stating to suspect I might have more questions in the future....(me rewriiting a 100 page site)
Can I upload a folder of the project, or a demo, somehow? I dont see an upload or attach button.. I would need to rename pages to publish a live demo.

[crispy68]

The easiest is to just upload the project file (.wbs) to your server and provide a link to it (ex: mysite.com/projectFile.wbs). In some cases we may need the images as well so just save the demo project in a folder which should also save the images and then zip up that file and upload to your server. You can also use Mediafire to upload your files to and provide the link.