Mathematically? That’s not possible. 33.33%3=100% you run out of space to add 3(10+10) margins. That’s extra 60px. But of course you can have 3 equal-sized items with 10px margins each. The items will simply be less than 33.33% of the container.
The simplest way to do this is use percentage values for the margins (say 1%) so that means each item has a width + 2%. (33.33%-2%=31.333%). Let’s see if that makes sense: Subtract the margins from 100 (100-6= 94) and then divide that with 3 (94/3=31.33%). That’s the width of each item in your grid.
If you need to use fixed values like 10px for the margins, then use pixel values for the width of the items. So, if you’re using the native container, that’s 940px on desktop. 940-60= 880. 880/3=293.33px. That’s the width of each item.
Note that in this case, the layout isn’t responsive, you’ll need to adjust it (preferably switch to the percentage values) for smaller devices.
Hope this is helpful.