JjMWxxm

index.html

<div class="center-div p-10">
  <div class="card bg-white w-96 shadow-lg">
  <figure><img src="https://churchofjesuschristtemples.org/assets/img/temples/fort-collins-colorado-temple/fort-collins-colorado-temple-3329.jpg" alt="car!"></figure>
  <div class="card-body text-black">
    <h2 class="card-title">Fort Collins, CO Temple      <div class="badge badge-accent">42k sq. ft.</div>
</h2>
    <p>On April 2, 2011, President Thomas S. Monson announced Fort Collins as the location of Colorado's second temple. There are approximately 140,000 members in the state. The first congregation of the Church in Colorado was organized in January 1897.</p>
    <div class="card-actions justify-end">
      <a href="http://churchofjesuschristtemples.org/fort-collins-colorado-temple/" class="btn btn-accent">Learn now!</a>
    </div>
  </div>
</div>

</div>

jjmwxxm.markdown

JjMWxxm

A Pen by Julian Cruz Sanchez on CodePen.

License.

style.scss

body {
  @extend .gradient;
  min-height: 100vh;
}

.center-div {
  height: 100%;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
 // text-align: center;
  align-items: center;
  justify-content: center;
}

.gradient {
   background: hsla(18, 76%, 85%, 1);
background: linear-gradient(90deg, hsla(18, 76%, 85%, 1) 0%, hsla(203, 69%, 84%, 1) 100%);
}

styles

<link href="https://cdnjs.cloudflare.com/ajax/libs/daisyui/2.13.3/full.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" rel="stylesheet" />