Question

所以我的页面中有两个元素：center 和 neighbor。

center 在我的页面中水平居中，neighbor 位于页面左侧。

center 是一个 div，它可以包含我无法亲自控制的任意高度的元素。 neighbor 是一个 div，它可以包含一个或多个 <a> 元素（也不是我可以更改的内容），我需要将它们水平显示为一行。

这是我目前的代码：

.page {
  text-align: center;
}

.wrapper {
  font-size: 32px;
  display: inline-block;
  position: relative;
}

.neighbor {
  position: absolute;
  right: 100%;
  top: 0%;
  margin-right: 10px;
  display: flex;
}

<div class="page">
  <div class="wrapper">
    <div class="center">foo<br>bar<br>oof</div>
    <div class="neighbor">
      <a>first&nbsp;</a>
      <a>second</a>
    </div>
  </div>
</div>

现在，我的问题是我想相对于 neighbor 的高度垂直居中 center。我尝试了几个对齐属性，例如 align-items、vertical-align、justify-content，但都没有帮助。

那么，有没有办法按照我想要的方式对齐 neighbor？

内联块内垂直对齐 div

0 个答案: