HTML中不同字体大小的左/右对齐

这个问题在这里已经有了答案：

如何将div的内容与底部对齐？ 24个答案

---

Flexbox可以做到这一点...但它需要一个包装元素。

.left {
  font-size: 300%;
}

div {
  width: 90%;
  margin: 1em auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  border-bottom: 2px solid grey;
}

<div>
  <span class="left">Left Alignment</span>
  <span class="right"> Right Alignment</span>
</div>

---

您可以使用弹性框与align-items:baseline; 属性

div{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 10px;
}

.left{
    font-size: 300%;
}

<div>
<span class="left">Left Alignment</span>
<span class="right"> Right Alignment</span>
</div>

链接地址: http://www.djcxy.com/p/75787.html

上一篇: Left/Right Alignment with Different Font Sizes in HTML

下一篇: Place div on bottom