css multi step progress wizard bar round edges

[jj123]

I am new to CSS and front end related items. I am trying to create a progress bar like so:

Img link.

Not sure how to go about it to get the round edges and adding icons with check mark.

Anyone can help with this.

Thanks.

[Paulie_D]

Border-radius would probably help. There’s nothing paricularly difficult here.

I’d suggest you do a lot more searching on Google etc and make an attempt.

We’re happy to help you over any hurdles you might have trouble getting over but we do prefer that you make a reasonable attempt, perhaps in a Codepen.io demo before doing so.

Thanks.

[jj123]

Here is the link to what I have tried:

link

[deb]

I have created a js fiddle, here is the link:

https://jsfiddle.net/debz/gjjmhv99/6/

I think this is what you want.

Cheers !!!

[Author]

Posts