[2021] html – ¿Cómo centro el texto verticalmente con CSS? {DH}

Otra forma (no mencionada aquí todavía) es con Flexbox.

Simplemente pegue el siguiente código en el Envase Elemento:

display: flex;
justify-content: center; /* align horizontal */
align-items: center; /* align vertical */
.box {
  height: 150px;
  width: 400px;
  background: #000;
  font-size: 24px;
  font-style: oblique;
  color: #FFF;
  text-align: center;
  padding: 0 20px;
  margin: 20px;
  display: flex;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */
}
<div class="box">
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh
</div>

Alternativamente, en lugar de ver el contenido a través del Envase, flexbox también puede centrar un artículo flexible con un margen automático si solo hay un artículo flexible en el contenedor flexible (como el ejemplo de la pregunta anterior).

Para centrar el elemento flexible tanto horizontal como verticalmente, simplemente colóquelo con. a margin:auto

.box {
  height: 150px;
  width: 400px;
  background: #000;
  font-size: 24px;
  font-style:...

Leer mas:
[2021] html – ¿Cómo centro el texto verticalmente con CSS? {DH}

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *