How to have dynamic text push other elements when resizing? [on hold]

Imagine a horizontal line of text from left to right: 1) the number of views of a video, then 2) an icon and 3) the date it was posted.

I want the margins between each of those 3 elements to stay the same regardless of each text's length. This means if the first text is long it will push away the other text to its right.

You can see in the image attached that in the first group on the list the number "12238" is overlapping the icon next to it. That's what I'm trying to fix.

enter image description here

This is a visual design question as I have to design for all those resizing scenarios. Any tips on how to accomplish this? Thanks in advance.