<div class="wrapper">
  <div class=upper>
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
  </div>
  <div class="content">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
    <div>6</div>
  </div>
</div>
.wrapper {
  width: 500px;
}
.upper {
  display: flex;
  width: 100%;
  align-content: stretch;
  background-color: pink;
}
.content {
  backgroun-color: yellow;
  display: flex;
  width: 100%;
  align-content: stretch;
  
}

.content div {
  width:100%;
  text-align: center;
  border: 1px red solid;
  height: 100px;
  
}

.upper div {
  background-color: green;
  width:100%;
  margin: auto;
  height:100px;
  background: url(http://dev.hozmagkomi.ru/Templates/__content/slider_top/3.png) no-repeat center;
 background-size: cover;
 text-align: center;
}

.upper :first-child {
  background: url(http://dev.hozmagkomi.ru/Templates/__content/slider_top/1.png) no-repeat center;
 background-size: cover;
}

.upper :last-child {
  background: url(http://dev.hozmagkomi.ru/Templates/__content/slider_top/2.png) no-repeat center;
 background-size: cover;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.