I want to arrange icons in an arc. I believe I should be using css
this is my Ui mockup
this is what i have right now:
this is my logic on how im creating the css coordinates for each social networks's icon im using aproximate numbers
and this is my CSS code, trying to fix each icon in place. it doesnt work.
.ic_pop1{
max-width:35px !important;
max-height:35px !important;
z-index:3 !important;
position: relative !important;
bottom: -460px !important;
left: 30% !important;
transform: translate(-50%, -50%)!important;
}
.ic_pop2{
max-width:35px !important;
max-height:35px !important;
z-index:4 !important;
position: relative !important;
bottom: -450px !important;
left: 40% !important;
transform: translate(-50%, -50%)!important;
opacity:0 !important;
}
.ic_pop3{
max-width:35px !important;
max-height:35px !important;
z-index:5 !important;
position: relative !important;
bottom: -400px !important;
left: 50% !important;
transform: translate(-50%, -50%)!important;
}
.ic_pop4{
max-width:35px !important;
max-height:35px !important;
z-index:6 !important;
position: relative !important;
bottom: -350px !important;
left: 60% !important;
transform: translate(-50%, -50%)!important;
}
.ic_pop5{
max-width:35px !important;
max-height:35px !important;
z-index:7 !important;
position: relative !important;
bottom: -400px !important;
left: 70% !important;
transform: translate(-50%, -50%)!important;
}