HTML和CSS:一行文本，跨距右对齐，全可见

Question

我有个问题。这是我的代码

<div class="comments_item">
  <a href="/post/123">Post 123</a>
  <span> - </span>
  <a href="/author/321">Author</a>
</div>
<div class="comments_item">
  <a href="/post/456">Post 456</a>
  <span> - </span>
  <a href="/author/654">Author</a>
</div>

如果文章的标题不合适，它是割礼线，末尾有一个省略号，意思是css。应完整显示作者的姓名。如果文章的标题很短，并且放在单元中，那么作者的名字应该紧跟在他后面。DIV是自适应的！

Answer 1

您需要应用css空白规则(可能还需要向第一个锚标记添加一个类)

white-space:nowrap;

到第一个锚点：http://css-tricks.com/almanac/properties/w/whitespace/

示例html代码：

<div class="comments_item">
  <a class="nowrap" href="/post/123">Post 123</a>
  <span> - </span>
  <a href="/author/321">Author</a>
</div>
<div class="comments_item">
  <a class="nowrap" href="/post/456">Post 456</a>
  <span> - </span>
  <a href="/author/654">Author</a>
</div>

示例css：

.nowrap{
    white-space:nowrap;
}