Unintentional duplicate breakpoint content?

[Earth Guest]

I am a newbie to Muse, but I'm determined to learn this, so please forgive my ignorance.

I have created a simple "Coming Soon" splash page with breakpoints for all standard devices... iPhone (320), iPhone Plus (414), iPad vertical (768), iPad horizontal (960) and desktop (1200).

I created the file with very few problems, and the file looks fine in Muse. When I open in the browser or upload to businesscatalyst, and view on each device, everything looks good EXCEPT for the iPad horizontal. The computer screen breakpoint (1200), which looks fine on the desktop, is duplicated as the breakpoint next to it (960), the iPad horizontal. In other words, the iPad horizontal view shows the 1200 desktop layout, which, of course, doesn't fit (way too big).

I deleted the 960 breakpoint in Muse and created a new one, but it's still wrong.

I thought maybe there was something hanging over, or connected to the 1200 (if that is possible, lol) which would somehow bring in the wrong breakpoint for iPad-h, but I can find nothing connecting the 960 with the 1200. I don't understand what could be doing this.

Any ideas? Thanks in advance for any help you can give!

EG

[fotoroeder]

Which iPad are you talking about?

At these days, using responsive design, it is recommended and good practice to design not for certain devices.

It is recommended to start at the biggest breakpoint (maximum width) and use this grey vertical "scrubber" on the right hand side

at the top of the canvas and redesign as soon as your design "breaks". That's the point, when breakpoints can get quite handy.

Could you provide a link so we can have a closer look on your issue?

Best Regards,

Uwe

[Earth Guest]

fotoroeder,

Thanks for responding.

iPad 9, 7.

leonardwheeler01.businesscatalyst.com

[Günter Heißenbüttel]

Would you please share your .muse with us, following these instructions: https://forums.adobe.com/docs/DOC-8652

Then we can have a closer look. I assume, this is a really small issue, which can be fixed without problems.

[Earth Guest]

Günter,

Here is the link to the .muse file in Dropbox. I left two pages in the file, both for the iPad size, because when I delete the vertical version, the horizontal version (the problem page) falls apart, which may tell us something.

Anyway, let me know if I need to do anything else. I'm assuming I saved the file without assets, since no assets showed up in that location.

Dropbox - Zen.TestPage1.4.18.muse

Thank you again for your help!

EG

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

Can’t see, what the issues have to do with „Unintentional duplicate breakpoint content“ as you are writing in the thread title.

The issues of your page are simple placement and scaling issues. Look at this small screencast:

• The white rectangle and the header elements bleed outside the breakpoint width, because,, for example, the rectangle is set from „Stretch to browser width“ to „responsive width and height“ starting at breakpoint 960 px.
• The text boxes are set to Scaling: None“ and pinned to the left.

If you fix these issues, all will work fine!

[Earth Guest]

You da man!

As I said, I am a newbie. Not knowing another way to explain my problem, all I knew was that I was seeing two of the 1200 layouts; one 1200 on the desktop, and another 1200 in the iPad horizontal, which did not make sense, because I knew I didn't intentionally make it that way. With my limited knowledge that translated to a duplicate of one breakpoint in two different locations. I thought about the possibility of something "hanging over," but I just couldn't see it. 

I so appreciate you taking the time to help me with this. I can instinctively tell Muse is amazingly powerful. I just need to invest time in it.

The Adobe support community rocks!!!!

[Günter Heißenbüttel]

Fine! If you have other questions, you know, where to go!