title: How to setup a responsive margin (about the width/height from the element applied on) in css?
body: <p>I would like to know if there is a way to set up a "responsive margin" in CSS.
  Here is an illustration of what i mean:</p>
  
  <pre><code>&lt;div style="width:100%;"&gt;
  
    &lt;div style="width:18%; margin:0 1%;"&gt;
    &lt;div style="width:18%; margin:0 1%;"&gt;
    &lt;div style="width:18%; margin:0 1%;"&gt;
    &lt;div style="width:18%; margin:0 1%;"&gt;
    &lt;div style="width:18%; margin:0 1%;"&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>I would like the <code>margin</code> to be smart enough to undestand "i want 1% of the <code>width</code>" and apply 0% of the <code>height</code> for <code>top/bottom</code>.</p>
  
  <p>Unfortunately this is not the default behavior, so how do you manage it ? Actually i am using javascript but i am trying to optimize my perfs.</p>