I've been using Xara for 18 years, but this is my first time doing xara webdesign. (In the past I've used wordpress on a shared hosting site.) My last hosting provider went kaput, leaving me without a website (long story short), so I've decided to take this opportunity to try xara. I'm using Xara Designer Pro x/18, running as administrator, starting from the Auberge template.

Naturally, I'm running into problems.

Ignoring all the rest of the problems, the one I'm primarily working on right now is one with buttons. I have 2 sets of buttons on a page that, from my point of view, look exactly the same (even in the layer gallery) but aren't operating the same when previewed an a browser (Firefox 95.0.2). Troubleshooting isn't helping. Here's a screenshot:

Click image for larger version.  Name: ButtonsScreenshot.png  Views: 44  Size: 435.5 KB  ID: 131332

I have 2 sets of pink buttons superimposed over 2 sets of images. The images are each embedded with corresponding text elements. Images are set to popup, so display a magnifying glass when the mouse hovers over them (this functionality does work on both sets of images).

My hope is that when a mouse hovers over the buttons, which set atop the images, the magnifying glass will then change to the "pointing finger" and allow the button to be clicked, accessing the link.

1. One set (above "shop all of argyleimp's fabric on spoonflower") functions as expected. When hovering over the images, the magnifying glass is shown, and the popup can be popped up. When hovering over a button, the mouse changes to the finger and the link can be accessed.
2. The second set (below "shop all of argyleimp's fabric on spoonflower") does not function as expected. The mouse (almost) always stays as a magnifying glass. Oddly, sometimes if I rapidly or slowly or jerkily move the mouse in the general area of the edges of the buttons the finger might show up.
a. In the cases where the magnifying glass only shows above the button, "inspect element" in the browser's tools reveals that there is no "onmouseover" code.
b. In the rare odd cases where the magnifying glass DOES change to a finger, "inspect" reveals that mouseover code does indeed exist.
c. When, in Xara, I pull the buttons away from the images and have them "sitting in the field" rather than on top of the images, then preview the webpage, the buttons work just fine. (So somehow the images and the buttons are playing havoc with each other?)

I understand that Xara is generating html and code in the background, so that things that I'm doing in the GUI might be generating wonky coding if I don't have things ordered/layered/grouped together correctly, but no matter how I try, I just can't figure out how to do this.

Rather than list the hours worth of fixes I've attempted, I was hoping someone might have an easy insight.

I know this screenshot is most likely less than helpful. I would like to be able to share my webpage in a way that the community here can help. Is there a way to do that without attempting to upload an incomplete website to my hosting provider?

Any input on this would be SO appreciated! I haven't been able to find anything in the forums.