"Sync" elements to behave responsive?

Hi!
I stumbled on a problem a couple times now and can’t solve it, although it seems simple.
I have a couple simple text elements with different sized content.

Goal:

  • Ability to define min and max widths for all elements for responsiveness.
  • All a- elements are always the same size and all b-elements are the same size and so on - no matter the screen size. So the system should basically look which elements needs to be sized down first, and then size down all its column-siblings at the same time/ width.

So far I used fixed sizes, accepted different sized elements or went mad with conditionals. Is there a way to sync the beakpoints dynamically within a specified range?