<div class="a">
        <p>hello</p>
    </div>

    <div class="a">
        <img width="100px" src="https://img.freepik.com/free-photo/closeup-shot-of-a-black-cat-in-a-room_181624-13579.jpg?t=st=1645563148~exp=1645563748~hmac=871a0d9ba65501c5132675b35786148c133a281eeccc8c5c1d16e014d85ac5e0" alt="">
    </div>

    <div class="b">
        hello <span>왼쪽 정렬</span>
    </div>

    <div class ="c">
        hello <span>오른쪽 정렬</span>
    </div>

    <div class="a">
        <span>가운데 정렬</span>
    </div>
.a {
  display: flex;
  justify-content: center;
  background-color: cyan;
  width: 300px;
}

.b {
  display: flex;
  justify-content: left;
  background-color: cyan;
}

.c {
  display: flex;
  justify-content: right;
  background-color: cyan;  
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.