コンテンツの左右に均等な空きスペースを確保しようとしています。justify を使用してみましたが、異なる長さのコンテンツで問題が発生しています。
質問: コンテンツの長さに関係なく、コンテンツの左右に均等な量の空きスペースを追加するにはどうすればよいですか? コンテンツの左側に 15px のパディングを必ず追加する必要があります。
コードを参照してください:
<div class="pop">
Over the weekend, I went to a sunset picnic on a rooftop in Brooklyn.
The evening couldn’t have been more picturesque — a group of stylish women
chatting and lounging on blankets, framed against a lavender and glittering
cityscape.
</div>
<div class="pop">
This is just one sentence as an example.
</div>
CSS:
.pop {
border: 1px solid #999;
margin-top: 10px;
padding-left: 15px;
padding-top: 10px;
padding-bottom: 10px;
text-align: justify;
padding-right: 15px;
}
アップデート:
コンテンツが中央に表示されないようにしたいのですが、左側と右側に同じ量のパディングがあるように見えるはずです。したがって、左側には padding-left: 15px; が必要です。右側のコンテンツは、左側のコンテンツと同じ量の空白になるように調整する必要があります。これがより明確になることを願っています。