¡Muchas gracias por tus amables palabras y por tu aprecio hacia mi contenido! Me alegra saber que has encontrado útil la información que he proporcionado. ¡Bienvenido a esta comunidad donde podemos aprender y compartir juntos! Si tienes alguna pregunta o necesitas ayuda en cualquier otro tema, no dudes en preguntar. Estoy aquí para ayudarte en lo que necesites. ¡Espero seguir brindándote información valiosa y ser de utilidad en tus futuras consultas! ¡Gracias nuevamente y bienvenido!
the circle.active in my CSS, all circles, not just the first, will have a color. I've double-checked the code, but it's the same as yours. So, what am I supposed to do now?
I don’t understand why the pseudo element before is on progress container …can you elaborate on that please …why wouldn’t it make sense as progress::before instead!
Hello Web Warrior! the ::before pseudo-element is added to the .progress-container class instead of the .progress class. This is because the .progress-container class represents the container that holds the progress bar, while the .progress class represents the progress bar itself. Adding the ::before pseudo-element to the .progress-container class ensures that the progress bar background color fills up the entire container, rather than just the progress bar itself. Happy Coding my friend!
Fir thes folks who will have problem with active circle, in HTML he made mistake and set active class to all elements, you need put it on just first. I suppose that he do this to sub to patreon and find results of the problem
Yeah me too... it took me nearly 2 hours to figure it out even though my code was all clear ...he is clearly doing it for patreon or maybe he forgot, whatever the reason I'm not watching anymore video of this channel
If you find this video helpful, give it a like as this would help it reach even more people! Also, subscribe if you haven't ! Thank you! 🙏 👉 Source Code Available Here: 🌱devmadeeasy.gumroad.com/l/buildstepprogressbar
@@erikamanahan8261 Hey Dev, I believe it's a typo somewhere, believe me... Sometimes, especially when tired, we are sure that our code is perfect, then we take a break and when we go back to the code, we clearly see the typo. To save you time, show us your code (you can use CODEPEN) and we can help you!
extremely cool, but I have a problem, my bar when I put the display flex in the class "progress-container" does not change to horizontal, it remains vertical, could you help me please? thanks in advance
@@DevMadeEasy i want this same progressbar vertically. For e.g i have 3 column in 1st colum vertical step progressbar. In 2nd content and 3rrd column images which are scrollable when we click on next step but without any NEXT button.
Extremaly good. Simple but efficient.
Glad you liked it!
I love it.♥️
Ur tutorials are amazing ✨
Thank you so much!!
Welcome to our Tribe.
thank you so much you're amazing, like and shared with others developers
Happy to help
agradecido por tu contenido!!, felicidades!!
¡Muchas gracias por tus amables palabras y por tu aprecio hacia mi contenido! Me alegra saber que has encontrado útil la información que he proporcionado. ¡Bienvenido a esta comunidad donde podemos aprender y compartir juntos!
Si tienes alguna pregunta o necesitas ayuda en cualquier otro tema, no dudes en preguntar. Estoy aquí para ayudarte en lo que necesites. ¡Espero seguir brindándote información valiosa y ser de utilidad en tus futuras consultas! ¡Gracias nuevamente y bienvenido!
thanks a lot, helped me sooo much
Glad it helped!
Thank you sir, that's great and useful~👍
Hello Web Warrior, I am glad you liked it.
Welcome to our Tribe.
As always: Happy Coding!
I love it
Thank you soo much
I'm glad you like it
how can add stop if validation don't work? or step not changed?
Waoww bro.. Thank you.. ! So nice your video
So nice of you
@@DevMadeEasy can't wait for interesting videos from you
Can you please explain the minus 1 on the actives, and circles'(.length)?
thanks so much man
Happy to help
thank you bro great job
Glad it helped
how are your files connected?
Hello Web Warrior, how are you doing?
Well, I connnect those lines through JavaScript and I show it visually using css.
Happy Coding!
Thank you!
You're welcome!
💪💪💪💪💪 thanks!!!!!!!!!
I'm glad you like it.
Happy Coding!
the circle.active in my CSS, all circles, not just the first, will have a color. I've double-checked the code, but it's the same as yours. So, what am I supposed to do now?
Hey DEV, please show your code, can you do that using "CodePen"?
99% of the time is a typo somewhere!
Let me know!!!
@@DevMadeEasy suree
@@berriesss the first element in html file only should be called as class = circle active others should be called as circle only.
Nice!
Thank you! Cheers!
I don’t understand why the pseudo element before is on progress container …can you elaborate on that please …why wouldn’t it make sense as progress::before instead!
Hello Web Warrior!
the ::before pseudo-element is added to the .progress-container class instead of the .progress class. This is because the .progress-container class represents the container that holds the progress bar, while the .progress class represents the progress bar itself. Adding the ::before pseudo-element to the .progress-container class ensures that the progress bar background color fills up the entire container, rather than just the progress bar itself.
Happy Coding my friend!
Fir thes folks who will have problem with active circle, in HTML he made mistake and set active class to all elements, you need put it on just first. I suppose that he do this to sub to patreon and find results of the problem
Yeah me too... it took me nearly 2 hours to figure it out even though my code was all clear ...he is clearly doing it for patreon or maybe he forgot, whatever the reason I'm not watching anymore video of this channel
If you find this video helpful, give it a like as this would help it reach even more people! Also, subscribe if you haven't ! Thank you! 🙏
👉 Source Code Available Here:
🌱devmadeeasy.gumroad.com/l/buildstepprogressbar
The .circle.active on my css makes all of circle has color not the first one only. What should i do?
Hey DEV, how are you doing?
Please show us you code, so we can help you out!
@@DevMadeEasy it's the same as your code
@@erikamanahan8261 Hey Dev, I believe it's a typo somewhere, believe me... Sometimes, especially when tired, we are sure that our code is perfect, then we take a break and when we go back to the code, we clearly see the typo. To save you time, show us your code (you can use CODEPEN) and we can help you!
@@DevMadeEasy Hello i have the same problem as Erika, however my code is the same as
yours 😅
En el html solo el primer div va con active, los demás no
extremely cool, but I have a problem, my bar when I put the display flex in the class "progress-container" does not change to horizontal, it remains vertical, could you help me please? thanks in advance
Hello Dev, how are you doing?
Can you please send us your code so we can check it out?
We will be happy to help !
it happened to me too. add flex-direction: row;
Can u help me with this same vertical using scroll effect?
Yeah, sure, I can make a video on that, tell me what you have in mind!
@@DevMadeEasy i want this same progressbar vertically. For e.g i have 3 column in 1st colum vertical step progressbar. In 2nd content and 3rrd column images which are scrollable when we click on next step but without any NEXT button.
You should have hosted the code... so that i will just copy
I have liked and subscribed
That's a good idea, thanks!
Happy Coding my new friend!
It doesn't move when I click next to the new html file
Hey DEV, can you please show us your code via Codepen; this way we can help you out!
Happy Coding!
Hi master a question :
Why don't I active everything I do
Hey Dev, share your code with us!
Let me know what you have in mind.
Happy Coding my friend!
How do I communicate with you?
@@abolfazlarghandehpoor9050 Hey dev, you can send me a msg on my FB Page.
Happy Coding!
awesome
Hey Dev, I'm glad you liked it!
will it mark the steps complete?
Hey Dev, yes it will!
Awesome video +++++++++++++++++++++++++++
Big thanks
Always remain at 1