Highlighted

Responsive Site w/multiple height headers on diff. breakpoints? How do I do this?

Engaged ,
Jun 19, 2017

Copy link to clipboard

Copied

Here's my problem. I built a responsive site with breakpoints for desktop, tablet, and mobile (smartphone). On the desktop and tablet, I want a header that is 100px tall. But on the mobile, I want the header to be only 50px tall. Should I have all of my 100px tall header data on a new master page, or on the Home page, but with a 50px header on the mobile breakpoint? I just don't know! What's the correct way to build this thing? Thanks!-

Adobe Community Professional
Correct answer by fotoroeder | Adobe Community Professional

You use one master page and everything you want to change from tablet to mobile should happen there.

If you reduce your header height, do so to your needs. Place all elements you need in your header, hide other elements (right click - hide in breakpoint - hide in other breakpoints is what you need here maybe), which you might have not enough space for.

Does this help for the beginning?

Each page could only have one master.

Does this help?

Uwe

Views

149

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Responsive Site w/multiple height headers on diff. breakpoints? How do I do this?

Engaged ,
Jun 19, 2017

Copy link to clipboard

Copied

Here's my problem. I built a responsive site with breakpoints for desktop, tablet, and mobile (smartphone). On the desktop and tablet, I want a header that is 100px tall. But on the mobile, I want the header to be only 50px tall. Should I have all of my 100px tall header data on a new master page, or on the Home page, but with a 50px header on the mobile breakpoint? I just don't know! What's the correct way to build this thing? Thanks!-

Adobe Community Professional
Correct answer by fotoroeder | Adobe Community Professional

You use one master page and everything you want to change from tablet to mobile should happen there.

If you reduce your header height, do so to your needs. Place all elements you need in your header, hide other elements (right click - hide in breakpoint - hide in other breakpoints is what you need here maybe), which you might have not enough space for.

Does this help for the beginning?

Each page could only have one master.

Does this help?

Uwe

Views

150

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jun 19, 2017 0
Adobe Community Professional ,
Jun 19, 2017

Copy link to clipboard

Copied

You use one master page and everything you want to change from tablet to mobile should happen there.

If you reduce your header height, do so to your needs. Place all elements you need in your header, hide other elements (right click - hide in breakpoint - hide in other breakpoints is what you need here maybe), which you might have not enough space for.

Does this help for the beginning?

Each page could only have one master.

Does this help?

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 19, 2017 0
Engaged ,
Jun 20, 2017

Copy link to clipboard

Copied

Thank you , this does help a great deal! I will be trying your suggestion out this evening.

Kind regards-

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 20, 2017 0
Adobe Community Professional ,
Jun 20, 2017

Copy link to clipboard

Copied

Let me know, you could open a new thread with newer questions or stay here.

We have great forum members to support you with almost everything , except food and coffee .

You could do all settings of size and place with on element each.

Even one text element for all breakpoints works fine.

There´s one exception, if you group elements (only with fluid width breakpoints), these should be copied and hided in all other breakpoints. Groups, once they´re set, want to show on all breakpoints and you have to deny that.

Keep on and best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 20, 2017 0