如何使两列中的一列水平到达视口的末端

要使两列中的一列水平到达视口的末端，可以使用CSS中的flexbox布局或者grid布局来实现。

使用flexbox布局：

在父容器上设置display为flex，使其成为一个flex容器。
设置父容器的justify-content属性为flex-end，将子元素水平对齐到容器的末端。

示例代码：

<style>
  .container {
    display: flex;
    justify-content: flex-end;
  }
</style>

<div class="container">
  <div class="column1">内容1</div>
  <div class="column2">内容2</div>
</div>

使用grid布局：

在父容器上设置display为grid，使其成为一个grid容器。
设置父容器的grid-template-columns属性，指定两列的宽度。
设置父容器的justify-items属性为end，将子元素水平对齐到容器的末端。

示例代码：

<style>
  .container {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 两列宽度相等 */
    justify-items: end;
  }
</style>

<div class="container">
  <div class="column1">内容1</div>
  <div class="column2">内容2</div>
</div>

以上是使用CSS布局实现将两列中的一列水平到达视口的末端。在实际应用中，可以根据具体需求选择合适的布局方式，并结合媒体查询等技术实现响应式布局。