Less fx allows you to make a smooth transition in size any properties relative to the width of the screen (if you're using Less 1.6 or later)

less

.prop-size-fx(@min-size: 1, @max-size: 2, @min-width: 768, @max-width: 1024, @property: font-size){
  @{property} : @max-size * 1px;
  @{property} :  ~"calc(@{min-size}px + (@{max-size} - @{min-size}) * ((100vw - @{min-width}px) / (@{max-width} - @{min-width})))";
  @media screen and (max-width: (@min-width + 1px))  { 
    @{property} : @min-size * 1px;
  }
  @media screen and (min-width: (@max-width + 1px)) {
    @{property} : @max-size * 1px;
  }
}
// example - .prop-size-fx(20,30,768,1024,margin-top);