How do I design something like this
I am trying to design this but I have been failing; the alignment of the triangle to the icons and also the way the rock paper scissor icons have depth have me confused. This is the best I could come up with
4 Replies
I set the triangle as a background image and overlayed the icons but the arrangement seems ver off
It looks like you nearly have it.
Presuming you have used absolute positioning on the icons, you need to add the offset (top, left, right or bottom) according to the width of the icon.
So for example the top-left one would need to have a negative top of icon-width / 2 and a negative left of icon-width / 2.
Here is a quick demo codepend https://codepen.io/cbolson/pen/yLrzGZN
(I used an SVG for the triangle for speed)
thank you very much