Sección con contenedor interno

Preparando el HTML

Para lograr esta estructura necesitamos un elemento section y un div al cual le vamos a agregar la clase “contenedor”.

La idea es aplicarle el color de fondo a nuestra sección y el contenedor se va a encargar de limitar el ancho de su contenido.

Importante cambiar el nombre de clase del section

<section class="mi-seccion">
  <div class="contenedor">...</div>
</section>

Estilos del contenedor

Si estamos utilizando Bootstrap, podemos omitir este paso y aplicar la clase “container”.

.contenedor {
  max-width: 1200px;
  margin: 0 auto;
}

Estilos de la sección

.mi-seccion {
  padding: 96px 0;
  background-color: #ffd484;
}

Resultado