The challenge requires that arrow positioning be accomplished with HTML and CSS alone. No JavaScript, no Images/SVG. Just Pure CSS.
The challenge is quite a tough one and this iis what I have at the moment. It is not perfect but somehow, am happy I could at least attempt it.
At the end, I learnt better. Yet, much more to learn.
Do you care how it is done? Checkout the source code for Scootie Challenge on Github.
Feel free to use the code and contribute improvements. The license file guides if need be.
The live demo is available for testing at Scootie Design.
Project undertaken courtesy of Google Africa Developer Scholarship (GADS2020) programme.