Список элементов с помощью flexbox - а иногда и ссылки

.advanced-list {
  padding-left: 0;
  list-style: none;
}

.advanced-list li {
  display: flex;
  min-height: 80px;
  zoom: 1;
  flex-direction: row;
  background-color: #f5f5f5; 
}

.advanced-list li .list-img {
  display: block;
  height: 235px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  flex: 0 0 235px;
  order: 1;
}

.advanced-list li .list-content {
  padding: 15px;
  line-height: 1.3333333;
  order: 2;
}

.advanced-list li .list-content .list-header {
  margin-top: 0;
  margin-bottom: 5px;
}

.advanced-list li .advanced-link {
  display: flex;
  color: #252525;
  text-decoration: none;
  flex-direction: row;
}

.advanced-list li+li {
  margin-top: 5px;
}

<ul class = "advanced-list">
  <li>
    <div class = "list-content">
      <h4 class = "list-header">List item without link</h4> Lorem ipsum dolor...
    </div>
    <div class = "list-img" style = "background-image: url('https://placehold.it/550x300?text=Img:+550+x+300')"></div>
  </li>
  <li>
    <a href = "#" class = "advanced-link">
      <div class = "list-content">
        <h4 class = "list-header">List item with link inside</h4> Short text - keep width 100%.
      </div>
      <div class = "list-img" style = "background-image: url('https://placehold.it/550x300?text=Img:+550+x+300')"></div>
    </a>
  </li>
</ul>