Graphics/Objects move around on page when published... how to fix?

[Mia_Kirsten]

Why do graphic elements (both placed images and elements drawn in Muse) move around on the page when I Preview and more importantly, export as HTML pages? Chrome and IE also display elements in different spots on my page... and not where I have them placed in Muse. How do I fix this?

[johnrs72]

Hard to believe this has been an issue since Sept of 2012 and it is still not resolved. The Pin feature doesn't help and neither does locking the item.

[adobelance1]

John,

What's the URL for your site, and which items are moving unexpectedly?

[johnrs72]

Thanks for the response. I did the page over from scratch and it worked, but I don't know why. It was a menu button (manual menu type that pointed to another page on the same site) that whenever I hit preview or publish, it would jump down or to the side an inch or two. I did not see anything different about the new page compared to the old one. I tried turning the pin on and off, footer checked on and off, and locking and unlocking, but no combinations of those worked. I also tried creating it in the master page and also just creating it in the home page. Oddly, the menu button would also shift when I copied the master page to the home page by dragging and dropping. But after doing it all over, it worked for some reason. Thankfully, I had only just begun working. Thanks.

[anita1390]

johnrs72 Sometimes there's a stray element on the design page outside of the page area, like a text box in the gray work space. This can cause stuff to bounce around. I "select all" (command A) when in the pointer/arrow tool to see if there are any stray elements that don't belong around the borders of the page.

[lindac8375]

that was the first thing i tried John. there's nothing lurking anywhere....

[lindac8375]

@john.... mine still not working. tried two test pages from scratch. any ideas?

[LaurissaBR]

I'm also having this problem and after reading the thread, haven't found anything that works—I'm totally stumped and incredibly frustrated.

For me, it's a box in the background and the text on top—but only on some pages at the smaller screen sizes (<800px) but not the same screen sizes. Nothing is checked as footer, there are no extra elements off the canvas, I've tried taking out the images and icons to see if that fixes it with no luck. I've included the links below to the pages that are a problem for me.

http://avorgsite-testing.businesscatalyst.com/who-we-are.html

http://avorgsite-testing.businesscatalyst.com/our-solutions.html

http://avorgsite-testing.businesscatalyst.com/our-record.html

[wendybarner]

I just had the same thing and I turned off pinning and it worked 10/2/16

[wades33496182]

I'm having the same problem: the images are drifting down the page. No combination of grouping, locking, or pinning seems to fix it. It also doesn't matter if I have the images in a separate box from the text...they still move down the page. I've also tried creating the page from scratch with no success.

The problem is identical in both preview mode and Chrome.

Screenshot of design: Dropbox - design.png

Screenshot of preview: Dropbox - preview.png 

[jessicab53884915]

Hi there! Hopefully this helps. I noticed the same issue on my website, and what fixed it was making sure that all the arrows on each page were pointing the same direction. I'm not sure what these arrows are called but they are located up by where you change the breakpoints. I always point mine facing outwards as this makes your site span bigger than the breakpoints you created it in. Making it viewable to bigger screens. Hope this helps! I'm not a pro muser, but this fixed my problem.

[Günter Heißenbüttel]

Jessica, you answered to a very old thread. I don't think, your post will be noticed!

For your information: These arrows, you are talking about cause, that your defined page width will be stretched to the width of the browser window. Of cause, this will change the gemetry of your page.

[alwinN]

Her reply is useful or relevant for someone who is searching for answers.  Even if it's a year later.

[LindaBlack]

I'm working with an older version of Adobe Captivate and was having an issue when I posted my project to the server and I found a post last week from early 2014 with a couple of people suggesting the same option to try and that worked for me and I'm so grateful these posts are available or I would be wasting time still researching!

[anita1390]

Hi Jessica,
I can not find my original question, but when I asked this it was because there were stray pixels outside of the working area. I'll check and see if I find the same results a you do, thanks for the heads up!!

Cheers,

Anita

[janf22872261]

Hi Mia,

I had the same problem, but only with some of the graphic elements on some of the pages. A bit of analysis revealed the problem: The graphic elements that would not display properly in the browser were all placed in rectangles inside other elements, e.g. inside a text-element. This made the browser relocate the graphic element in the browser.

From here on, the solution was simple: I removed the wrongly displayed graphic elements, tightened/resized the text-elements, and put the graphic elements back on the page outside of any other element than their rectangle-containers. That solved the problem!