タイトルの通りです。
●NG例
この文字は中央揃えで
す。
文字を中央揃えにしたいけど、改行されて上記のようになるのは嫌なので折り返されるときは左揃えにしたい、という場合の指定です。
●HTML
<div class="box">
<p class="caption">テキストが入る。</p>
</div>
●CSS
.caption {
width: fit-content;
max-width: 100%;
margin-inline: auto;
text-align: left;
}
親要素 .box には何かしらの幅が設定されるようにしてください。
それより狭い場合は .caption の幅が文字にフィットして左右にマージンがつくため、中央揃えのようになります。
