Thanks for the help. I’m using a service to take automated screenshots with various combinations of devices / resolution and the source page I used to start my own page with has a much more consistent layout across devices/resolution (without any of the custom code you suggested). I used the construction demo 1. Can you tell me what I need to do to replicate this success? The only difference beyond your custom code + what I did compared to the dome, from what I can tell, is the background image height is 874px and the slider set at a 100% (vs fixed 700) + the addition of a custom contact layer on top of it at the bottom (just like the demo business consulting 1 index page). Again I’m strictly speaking about the blue/orange shape position. On the constructions demo 1, it pretty much always appears at the exact same place. Ideally I could achieve the same result with a 874 pixel height image while keeping my custom layer as well. See the link below and you’ll clearly see what I’m taking about (took me quite a while to assemble – those are strictly Mobile Safari tests but the same is true with Mobile Chrome, etc.). Sometimes the image aspect ratio is completely different between the demo and my page (ie. p.3 for instance). My code is probably to blame at this point but it seems that with the demo constructions 1, you achieved better consistency with much less code (less change for me to screw up…). Please help (most current code is the index2.html).
https://servicesjsr.com/Comparison.zip