要修改上下两列div的间距，可以使用CSS中的margin属性来增加或减少间距。以下是几种常见的方法来调整间距：

方法1：直接在两列div之间添加间距

<div style="display: flex; align-items: stretch;">
  <div style="margin-right: 20px;">第一列内容</div>
  <div>第二列内容</div>
</div>

在这个例子中，第一列div有一个向右的外边距margin-right: 20px;，这会在两列之间创建20像素的间距。

方法2：使用外层容器来控制间距

<div style="display: flex; justify-content: space-between;">
  <div>第一列内容</div>
  <div>第二列内容</div>
</div>

在这个例子中，使用justify-content: space-between;可以使得两列div之间的间距均匀分布，并且与外层容器的边缘对齐。

方法3：使用负margin来调整间距

如果你使用的是浮动或传统的布局方法，可以使用负margin来调整间距：

<div>
  <div style="float: left; width: 49%; margin-right: -100%; padding-right: 20px;">
    第一列内容
  </div>
  <div style="float: left; width: 49%; margin-left: 20px;">
    第二列内容
  </div>
</div>

在这个例子中，第一列div有一个负的margin-right，这会使得第二列div向左移动，从而减少两列之间的间距。同时，第一列div有一个padding-right来增加列内的间距。

方法4：使用CSS Grid布局

<div style="display: grid; grid-template-columns: 1fr 1fr; grid-gap: 20px;">
  <div>第一列内容</div>
  <div>第二列内容</div>
</div>

在这个例子中，grid-gap属性用于设置两列之间的间距。

方法5：使用Flexbox布局

<div style="display: flex;">
  <div style="flex: 1;">第一列内容</div>
  <div style="flex: 1; margin-left: 20px;">第二列内容</div>
</div>

在这个例子中，第二列div有一个向左的外边距margin-left: 20px;，这会在两列之间创建20像素的间距。

方法6：使用内联块元素

<div>
  <div style="display: inline-block; vertical-align: top; margin-right: 20px;">第一列内容</div>
  <div style="display: inline-block; vertical-align: top;">第二列内容</div>
</div>

在这个例子中，两列div被设置为内联块元素，并且第一列div有一个向右的外边距。

可以根据布局需求和偏好选择合适的方法来调整两列div之间的间距。记得调整margin或padding的值以满足设计要求。