CSS calc()

CSS calc() function give a way to calculate values. See: calc() function on MDN

width: calc(33% - 2rem);

Example 5.2 - box sizing - Example 5.2
  
 <ul>
   <li>Item One
   </li>
   <li>Item Two
   </li>
   <li>Item Three
   </li> </ul>

In style element (<style>) within head element: 


  ul, li { margin-left: 0; padding-left: 0;}
  ul { list-style: none; overflow: auto; background-color: #ffffdd; border: thin solid black;}
  li { box-sizing: border-box; padding: 1rem; margin: 1rem; float: left; width: calc(33% - 2rem);
    font-weight: bold; text-align: center; border: 5px dotted green; }
 

Screenshot