<div class="row">
<div class="item item-1">
  <h1>250px</h1>
</div>
<div class="item item-2">
  <h1>The rest</h1>
</div>
</div>
<div class="row">
<div class="item item-1 img-1">
</div>
<div class="item item-2 img-2">
</div>
</div>

body {
  font-family: arial;
}

h1 {
  font-size: 18px;
  color: #333;
}

.item {
  float: left;
  box-sizing: border-box;
  padding: .5em;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

.item-1 {
  width: 250px;
}

.item-2 {
  width: calc(100% - 250px - .75em);
  margin-left: .75em;
}

.img-1 {
  height: 250px;
  background-image: url('https://placekitten.com/450/');
}

.img-2 {
  height: 250px;
  background-image: url('https://placekitten.com/g/900/');
}