有四个div并排，一个在最左边，一个在最右边，中间两个上下并排

您可以使用CSS的flexbox布局来实现这个效果。以下是一个示例代码：

<div class="container">
  <div class="left"></div>
  <div class="middle-top"></div>
  <div class="middle-bottom"></div>
  <div class="right"></div>
</div>

.container {
  display: flex;
  justify-content: space-between;
}

.left {
  width: 25%;
}

.middle-top {
  width: 50%;
}

.middle-bottom {
  width: 50%;
}

.right {
  width: 25%;
}

在这个示例中，我们使用了flexbox布局来创建一个容器，使其包含四个子元素。然后我们使用`justify-content: space-between`属性将元素水平排列，每个元素之间留有空白。

接下来，我们为每个子元素指定了一个宽度，使得左右两个元素分别占用容器的25%宽度，而中间两个元素则分别占用容器的50%宽度。这样就可以实现上下并排的中间元素。