← all Bulma classes list

Bulma class: .media.is-large

<article class="media is-large">
  <figure class="media-left">
    <p class="image is-64x64">
      <img src="https://bulma.io/images/placeholders/128x128.png">
    </p>
  </figure>
  <div class="media-content">
    <div class="content">
      <p>
        <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
        <br>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.
      </p>
    </div>
  </div>
  <div class="media-right">
    <button class="delete"></button>
  </div>
</article>

Preview

John Smith @johnsmith 31m
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare magna eros, eu pellentesque tortor vestibulum ut. Maecenas non massa sem. Etiam finibus odio quis feugiat facilisis.

Use Shuffle AI to build your own Bulma CSS templates

Quickly design stunning Bulma CSS templates with the power of Shuffle AI — no coding required.

More in Bulma Media