您的问题似乎是容器也缩小了 （因此六个100px宽的项目的实际空间小于600px）-正是因为它也应用了box-sizing: border-box。
border-box告诉浏览器在您为元素的宽度和高度指定的值中考虑任何边框和填充。如果您将元素的宽度设置为100像素，则这100像素将包括您添加的任何边框或填充，并且内容框将缩小以吸收额外的宽度。
从https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing开始
将容器的box-sizing重新设置为content-box，它的项目将适合。

* {
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
}

html, body {
    margin: 0;
    padding: 0;
    background-color: rgb(244, 244, 244);
}

.container {
    background-color: antiquewhite;
    height: 100vh;
}

.flex-container {
    margin: auto;
    display: flex;
    border: 1px solid black;
    background-color: aqua;
    width: 600px;
    flex-flow: row wrap;
    box-sizing: content-box;
}

.flex-item {
    border: 1px solid black;
    width: 100px;
}

<div class="container">
   <div class="flex-container">
    <div class="flex-item">Item 1</div>
    <div class="flex-item">Item 2</div>
    <div class="flex-item">Item 3</div>
    <div class="flex-item">Item 4</div>
    <div class="flex-item">Item 5</div>
    <div class="flex-item">Item 6</div>
  </div>
</div>