Посмотрите на следующую скрипкуhttps://jsfiddle.net/27x7rvx6

CSS (#test является контейнером flexbox, и.items это его дети)

#test {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  width: 300px;
  margin-left: 150px;
  border: 2px solid red;  
}
.item {
  flex: 0 0 70px;
  margin-right: 10px;
  background: blue;
  height: 70px;
  border: 2px solid black;
}

Есть одна строка (nowrap) flexbox с элементами фиксированного размера. Контейнер имеетjustify-content установлен вcenter, Поскольку элементы не могут сжиматься и вместе шире контейнера, они начинают переполняться.

Моя проблема в том, что содержимое переполняется как слева, так и справа. Есть ли способ сделать контент оправданным по центру, но как только он начинает переполняться, заставляет его действовать какjustify-content свойство установлено вflex-startсоответственно сделать его переполненным только справа от контейнера?