[Resolved] Weird displacement issue in Firefox
If you have a look at the site I’m developing you can see that there’s a slight displacement between the slide and its background. If you hover it gets worse.
This only occurs in Firefox and only on shows with more than one slide (i.e. where the navigation comes into play)
I’ve tried adjusting various display elements with no real success. I did manage to stop it displacing, by changing the nav display to inline, but the nav buttons no longer faded away and the larger gap at the top was then constant.
First thing that could be causing layout issues is the code tags wrapped around the shortcode. Switch the the HTML view in the post editor and you’ll see them. Remove those tags and see if that changes anything.
But I wouldn’t try to move the slide images around with padding like that. The slideshow is supposed to scale to the size of the slide images and crop anything that hangs out, so adding anything extra into the slides can cause layout issues.
Instead, just set the slideshow size to match the size of the white area in the iPad exactly, re-aize the slide images to that size as well, and re-upload them. Then instead of adding padding to each image, you can add padding to the slideshow container where the iPad BG image is set, and center up the slides in the white area.
Aha! I couldn’t see the tags in the code. Turns out there was an autosaved version that WordPress had added them to. That fixed the majority of the problem. It’s still doing a slight shift to the right, but I can live with that.
Good advice on the padding side of things. I’ll have a play and see what I can do about that. Thank you! 🙂
- The topic ‘[Resolved] Weird displacement issue in Firefox’ is closed to new replies.