html - 需要帮助添加飞机在一条线上

Question

我最初将设计作为 css 中的内容值，但尝试将其更改为自己的 div 并测试它是否是结构问题。我只需要飞机恰好位于直线较粗部分的末端。

它是多么痛苦的关闭图像:

#two {
  background-size: 100%;
  background-image: linear-gradient(to right, #ffffff, #000000);
  margin-right: 200px;
  margin-left: 80px;
  overflow: visible;
  height: 1px;
  padding: 0.0em 0.0em 0.0em 0.0em;
  border-bottom: 10px;
}

.divider {
  border: 1em 1em 1em 1em;
  padding: 1em 1em 1em 1em;
}

.plane {
  padding: 0.5em 0.5em 0.5em 0.5em;
  margin-left: 1150px;
  margin-bottom: 100px;
}

<div class="divider">
  <div id="two"></div>
  <div class="plane">✈</div>
</div>

Answer 1

#two {
  background-size: 100%;
  background-image: linear-gradient(to right, #ffffff, #000000);
  overflow: visible;
  height: 1px;
  padding: 0;
  border-bottom: 10px;
}

.divider {
  position: relative;
  padding: 1em;
  margin-top: 70px;
}

.plane {
  position: absolute;
  top: -1px;
  right: 0;
  padding: 0.5em;
  bottom: 0;
}

<div class="divider">
  <div id="two"></div>
  <div class="plane">✈</div>
</div>