CSS3遷移はI 5つの中央整列ボックス（画像）で構成されたバーを有する

Question

を整列：これらのボックスがクリックされたとき

.boxes { 
display:inline-block; 
text-align: center; 
} 

、ディスプレイが簡単なを通じて（なしに変更されますjsスタイルの変更）、残りのボックスは中央の配置のために水平方向に中央に移動します。 私はこの運動のためのCSS3トランジションを持つようにしたい - この

transition: translate 1s linear; 

のようなものは、これを実行することが可能ですか？

Answer 1

text-alignは、animatable CSS propertiesのいずれでもありません。そう、いいえ、譲渡することはできませんtext-align。

あなたが望むことを達成するには、ボックスのそれぞれを絶対的に配置し、隣り合わせになるとJSで位置を計算し、ボックスの1つが削除されたときの位置を計算する必要があります。
その後、leftとrightプロパティを変更することでボックスを遷移させることができます。