居中对齐项目，然后隐藏一些项目，但仍然保持中心对齐

Question

我的中心对齐了3个svg。用户选择从后端显示哪些显示，其余的隐藏。我想让这些图像居中对齐。现在，如果隐藏了一个或多个图像，则会为该区域留出空白空间。我正在使用不透明度来隐藏项目 代码：

<div class="parent">
  <div class="work--service_provided">
  1
  </div>
  <div class="work--service_provided" style="display:none;">
  2
  </div>
    <div class="work--service_provided">
  3
  </div>
</div>
.work--service_provided{
    text-align: center;
    display: inline-block;
    margin: auto;
}

Fiddle

Answer 1

两种方式：

1. 将以下内容添加到您的css

   .parent {   text-align：center; }

https://jsfiddle.net/dalinhuang/eret23y8/4/

1. add align =＆＃34; center＆＃34;致你的父母

<div class="parent" align="center">

https://jsfiddle.net/dalinhuang/eret23y8/3/