<section class="padding-y-xl">
  <div class="container max-width-adaptive-md">
    <div class="grid gap-md items-center@md">
      <figure class="col-6@md">
        <img class="block width-100%" src="https://images.unsplash.com/photo-1517340073101-289191978ae8?ixlib=rb-1.2.1&q=85&fm=jpg&crop=entropy&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ" alt="Image description">  
      </figure>

      <article class="text-component line-height-lg v-space-md col-6@md">
        <h1>Section One</h1>
        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Tempora optio earum suscipit quasi possimus mollitia! Assumenda, maxime quis dolor soluta optio molestias accusamus, harum vero ipsum officia quo eaque nulla praesentium debitis eum non facilis velit consectetur. At, voluptates animi!</p>
      </article>
    </div>
  </div>
</section>
// 🐞 CodyFrame
// 📝 Docs: codyhouse.co/ds/docs/framework/grid-layout#container
View Compiled

External CSS

  1. https://codepen.io/codyhouse/pen/Wqvpmm
  2. https://unpkg.com/codyhouse-framework/main/assets/css/style.css

External JavaScript

  1. https://unpkg.com/codyhouse-framework/main/assets/js/util.js