title: How can I optimise this css code for not writing same css code several times in html?
body: <p>I have an input box. Where the values are already defined in or it will be generated in some other rules that's why they all have <strong>individual</strong> <strong>id's</strong>.</p>
  
  <p>html code:</p>
  
  <pre><code>&lt;input class="box" type="text" style="width:8%; text-align:center" id="a" value="A" readonly="true"/&gt;
  &lt;input class="box" type="text" style="width:8%; text-align:center" id="b" value="B" readonly="true"/&gt;
  &lt;input class="box" type="text" style="width:8%; text-align:center" id="c" value="C" readonly="true"/&gt;
  &lt;input class="box" type="text" style="width:8%; text-align:center" id="d" value="D" readonly="true"/&gt;
  &lt;input class="box" type="text" style="width:8%; text-align:center" id="e" value="E" readonly="true"/&gt;
  </code></pre>
  
  <p>now suppose, i've to decrease the size of the <strong>width</strong> 8 to 6. Then I've to write <code>width:6%'</code> 5 times, which is redundant thus I don't wanna use it. Is there any way I can improve this or write any loop for this?</p>