2021-01-24 Ad Unit

by Ttt Yyy

HTML

<div id="container">
  <div class='item'>
    <img src='http://placehold.it/100x75' />
    <p class='text'>
      Lorem ipsum dolar sit amet
    </p>
    <button class='button'>
    Like
    </button>
  </div>
  <div class='item'>
    <img src='http://placehold.it/100x75' />
    <p class='text'>
      Lorem ipsum dolar sit amet
    </p>
    <button class='button'>
    Like
    </button>
  </div>
  <div class='item'>
    <img src='http://placehold.it/100x75' />
    <p class='text'>
        Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
    </p>
    <button class='button'>
    Like
    </button>
  </div>
</div>

CSS

#container {
  display: flex;
}

.item {
  border-left: 1px solid gray;
  /* padding: 10px; */
  padding: 0 12px 32px;
  position: relative;
  width: 124px;
}

.item:first-child {
  border-left: none;
}

.button {
  position: absolute;
  bottom: 0;
}