CSS如何在同一个div中左对齐一个单词和另一个单词？

Question

如何在同一个div中左右对齐一个单词和另一个单词？

Answer 1

解决方案1:

HTML:

<div>
    <div class="left">left text</div>
    <div class="right">right text</div>
</div>

CSS:

.left {
    float: left;
}
.right {
    float: right;
}

解决方案2:

HTML:

<div>
    <div class="left">left text</div><!-- no space here
 --><div class="right">right text</div>
</div>

CSS:

.left {
    text-align: left;
}
.right {
    text-align: right;
}
.left, .right {
    display: inline-block;
    width: 50%;
}