I've been working on creating a step bar that needs to adapt to any number of steps provided by the backend. Here's what I have so far:
https://i.sstatic.net/cj4qZ.png
It looks fine, but connecting the circles with bars would be beneficial. However, there is an issue on smaller screens where the dates break into two lines:
https://i.sstatic.net/luyPe.png
Is there a way to keep these divs aligned at all times? Another concern arises on small screens as I want to place text side-by-side with icons. Despite defining columns within the main div (col-xs-6), it doesn't seem to work:
https://i.sstatic.net/0PsP6.png
UPDATE1: Thanks to @prabesh-gouli, I was able to resolve one problem, which was aligning elements side-by-side. However, the issue with dates persists.