ひっさびさに投稿するのだけど、基本メモなので最低限のテストしかしてません。
よく段落は左揃えだけど、全体としてはセンターに揃えたい、ということはありますよね?私だけ?
これまではラッパー要素で囲って、inline-block使ってたんですが、ちょっと違う方法思いつきました。
/* これまでこんな感じ */
<style>
.wrapper {
text-align: center;
}
.wrapper > p {
display: inline-block;
}
</style>
<div class="wrapper">
<p>ダミーテキストです。ダミーテキストです。ダミーテキストです。<br>ダミーテキストです。</p>
</div>
/* 思いついたのは */
<style>
.left-centered {
display: flex;
text-align: left;
}
.left-centered::before,
.left-centered::after {
content: '';
flex-grow: 1;
}
</style>
<p class="left-centered">ダミーテキストです。ダミーテキストです。ダミーテキストです。<br>ダミーテキストです。</p>
HTML側がシンプルになり、要素を追加せずに修正対応もできるかな。