左揃えのまま中央寄せ

文章を左揃えのまま中央にセンタリングしたい場合があります。

そんな時には、inline-blockを使用します。

inline-blockはtext-alignの指定を受けるので、
親要素にtext-align:centerを指定して中央寄せにすることが出来ます。

■html

  

    test
  

■css
.box{
  text-align: center;
}
.text{
  text-align:left;
  display:inline-block;
}