Can we define min-margin and max-margin, max-padding and min-padding in css?

Question

Can we define min-margin and max-margin, max-padding and min-padding in CSS ?

Answer 1

I wrote a library to do this, you can view it here: https://codepen.io/nicetransition/pen/OyRwKq

to use in your case:

.selector {
    scale($context, $base-size, $limit-size-min, $limit-size-max, $property: padding-right);
    scale($context, $base-size, $limit-size-min, $limit-size-max, $property: padding-left);
}

• $context: Max-width of your container

• $base-size: Root font size

• $limit-size-min: The minimum size

• $limit-size-max: The maximum size

  .selector { scale(1400px, 16px, 5px, 20px, $property: padding-right); scale(1400px, 16px, 5px, 20px, $property: padding-left); }

This would scale down to 5px and up to 20px, between 5-20 it is dynamic based of vw