The following code will make the label width the same as the column that it is fitted in, like this:
So when you resize the column, the label width will also be resized, which makes it responsive.
Apply the following CSS and add the class to your badge widgets. Again, you're free to name the class the way you like it.
I'm going to give you a little hint. If you want all the labels to be the same size regardless of the text within the label, you have to work with some kind of a fixed width. Because currently, the width of your label is based on the padding that is set on the text. More text > bigger label. So you have to experience with a fixed width. There are multiple ways to approach this. Keep in mind that all possible text options need to fit within the given width, otherwise the text might get wrapped, that's obviously not something you want to happen.