Responsive Widget breaks design

[leom75663467]

Hello Muse Community. I have some problems with a Quickinfo Muse widget. I would like to have the triggers and bubbles to be centered but at the same time muse doesn't allow me to set the whole widget to "non-responsive". I think in the new muse versions especially this "responsive" and "centered" at the same time causes the design to break and the site to enlarge unnecessarily on the right side. Does anybody have a solution to this problem? Thanks in advance.

fotoroeder​ do you have an idea?

Real Estate

Dropbox - forum.muse

Cheers,

Leo

[Günter Heißenbüttel]

Could you please clarify your issue?

• You want „the triggers and bubbles to be centred“? If you center the triggers, they will be placed one over the other.
• If you want to centre the „bubble“ you shouldn’t use the option „Position: Scattered“, but „Position: Stacked“.
• If you are talking about the fact, that in smaller breakpoint the pages starts to shift in browser view: This is the case, because at smaller breakpoint most of the page elements overlap the page/breakpoint boundaries – what is strictly forbidden!. Read more about this here: https://forums.adobe.com/docs/DOC-8953​. The simplest solution: You have to place your elements in a way, that there is no chance for them, to overlap the breakpoint width. If they do, you have to introduce a new breakpoint and reposition/resize the elements accordingly.

[leom75663467]

Hello Herr Heißenbüttel,

yes exactly, I don’t want to center them but rather „pin them to the center“ because I have this image of the string in the background and the triggers need to be matched with the interruptions in the string if you understand what I mean.

The third bulletpoint is exactly the problem which I am facing with the difference that it even starts overlapping at higher breakpoints. What is the easiest solution to tackle the problem without introducing many breakpoints?

Thanks for the support!!!

[Copies of email replies removed by moderator.]

[Günter Heißenbüttel · Accepted solution]

No way to achieve this without breakpoints! And: It will take you a long, long time to achieve, what you want.

I tried for over an hour, and I know, it will work, but I hadn’t complete success after this time. The reason is the responsive behaviour of your page, which causes many issues if you don’t respect the different scaling behaviour of the different elements (image, rectangle, text, …) More informations about this here: https://forums.adobe.com/docs/DOC-9082

I’d suggest, to find a different basic layout. It will get much, much easier, if you use a straight line instead of curves.