The Santa Monica Pier is a large double-jointed pier at the foot of Colorado Avenue in Santa Monica, California. With an iconic entrance, the pier is popular with residents and visitors as a landmark that is over 100 years old.

View the Santa Monica Pier layout

CSS for this layout.

 <style type="text/css">
      body {
        background: #041214;
        font-family: "Open Sans", sans-serif;
        display: grid;
        grid-template-columns: 1fr 1fr;
        margin: 0;
        min-height: 100vh;
      }

      figure {
        align-self: end;
        grid-column: 1;
        grid-row: 1 / 3;
        margin: 0;
        position: relative;
      }

      figcaption {
        background-color: hsl(100, 100%, 1%, 0.5);
        bottom: 5vh;
        color: #fff;
        padding: 1em 2em;
        position: absolute;
      }

      h1 {
        color: #69c69e;
        font-family: "Pacifico", cursive;
        font-size: var(--font-size-x-display);
        margin: 0;
      }

      p {
        margin: 0;
      }

      .left p {
        color: #fdfeff;
        font-style: italic;
        font-weight: bold;
      }

      img {
        height: 100vh;
        width: 100%;
        object-fit: cover;
      }

      .right {
        grid-column: 2;
        grid-row: 1 / 3;
        margin: 0;
        padding: 2em;
      }

      .right p {
        color: #c3cde5;
        max-width: 40ch;
      }

      .right small {
        color: #848489;
        font-style: italic;
        max-width: 40ch;
      }
    </style>