Highlighted

Edit Breakpoint's without Overlap

Community Beginner ,
Nov 05, 2018

Copy link to clipboard

Copied

Hey!

I'm having an issue where my sidebar on the site on mobile and 125%+ on desktop are overlapping. Now i imagine it is something to do with my breakpoints, I have tried to make a smaller breakpoint but it is only allowing me to resize everything for all breakpoints (menu, header, sidebar) etc..

Is there a way that I could maybe put a button for a drop down, or just resize it so i don't overlap the sidebar menu?

website is: mackgraham.ca

All help is appreciated here

Thanks!

If you can’t make the font smaller, the sidebar can’t be smaller – what means: Your layout is not appropriate. Create a new layout in this case.

And: Of course you can make the font smaller breakpoint-wise:

Text-formatting-breakpoints.jpg

Views

293

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

Edit Breakpoint's without Overlap

Community Beginner ,
Nov 05, 2018

Copy link to clipboard

Copied

Hey!

I'm having an issue where my sidebar on the site on mobile and 125%+ on desktop are overlapping. Now i imagine it is something to do with my breakpoints, I have tried to make a smaller breakpoint but it is only allowing me to resize everything for all breakpoints (menu, header, sidebar) etc..

Is there a way that I could maybe put a button for a drop down, or just resize it so i don't overlap the sidebar menu?

website is: mackgraham.ca

All help is appreciated here

Thanks!

If you can’t make the font smaller, the sidebar can’t be smaller – what means: Your layout is not appropriate. Create a new layout in this case.

And: Of course you can make the font smaller breakpoint-wise:

Text-formatting-breakpoints.jpg

Views

294

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
Nov 05, 2018 0
Adobe Community Professional ,
Nov 05, 2018

Copy link to clipboard

Copied

You shouldn`t watch websites at 125%, I assume. Watch it at 100% and it should work pretty well.

From what I see on your link you didn´t create a responsive website. In smaller breakpoints you have to replace and maybe resize  your elements. It may also help if you set the image to be responsive in width and height. At the moment it is simply fixed to one size, isn´t it?

Bildschirmfoto 2018-11-06 um 08.37.37.png

Bildschirmfoto 2018-11-06 um 08.37.27.png

Kind 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...
Nov 05, 2018 1
Community Beginner ,
Nov 06, 2018

Copy link to clipboard

Copied

Thanks for the response..

Yes the issue i am having is only on the mobile version of the site...

I have not made a mobile site yet, and was hoping to just have it as it is now.

Is there anyway to keep the sidebar from overlapping content on the mobile site?

I have tried resizing the breakpoints but i cant make the font or sidebar any smaller or it adjusts the size of it on all breakpoints.

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...
Nov 06, 2018 0
LEGEND ,
Nov 06, 2018

Copy link to clipboard

Copied

If you can’t make the font smaller, the sidebar can’t be smaller – what means: Your layout is not appropriate. Create a new layout in this case.

And: Of course you can make the font smaller breakpoint-wise:

Text-formatting-breakpoints.jpg

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...
Nov 06, 2018 0
LEGEND ,
Nov 06, 2018

Copy link to clipboard

Copied

Unfortunately, there is no way to create a responsive(!) area next to a fixed width area in Muse.

Muse calculates responsiveness according to the window width. If you have a side bar, it would have to be able to calculate responsiveness according to window width – side bar width. This isn’t doable – what means, you have to rethink your design.

If you have access to the Muse Prerelease forum, have a look at this thread: https://forums.adobeprerelease.com/muse/discussion/4776/sidebar-the-forgotten-feature

If you don’t have access, you may sign into this forum.

Talking about fixed width web sites , it is no real problem to achieve, what you want:  You have to resize the image breakpoint-wise, so it „snaps“ to the new size, when a fixed breakpoint is reached. Attention: Don’t pin the image at all!

By the way: I think, you have responsive breakpoints (though unnecessary on your site) and the image is pinned to the right. Revert your breakpoint(s) to fixed width (double click onto the breakpoint icon in the breakpoint bar) and set it from „fluid“ to „fixed" width.

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...
Nov 06, 2018 1
Community Beginner ,
Nov 06, 2018

Copy link to clipboard

Copied

Hey thanks for the response...

I guess my main question is if you can edit the breakpoints separately from one another, which would be great... Although it does not sound like the case.

How are other websites able to not have a mobile design and content not overlap itself on mobile?

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...
Nov 06, 2018 0