<p class="center"><span>Этот текст находится посередине</span></p>
<div class="center">
  <img src='https://images.unsplash.com/photo-1523049673857-eb18f1d7b578?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ' alt=''>
</div>
/* Стили, относящиеся к этому примеру */
.center {
  text-align: center;
}


/* Остальные стили */
.center {
  padding: 24px;
  margin: 24px;
  background: #eee;
  resize: both;
  overflow: auto;
}

img {
  padding: 12px;
  background: #fff;
  box-shadow: 2px 1px 6px rgba(0,0,0,.2);
}

p {
  font: 18px Roboto;
  text-transform: uppercase;
  color: #2196F3;
}

External CSS

  1. https://fonts.googleapis.com/css2?family=Roboto:wght@300&amp;display=swap

External JavaScript

This Pen doesn't use any external JavaScript resources.