HTML 样式：无法右对齐一行的后半部分答案

【问题标题】：HTML styling: unable to right-align the second half of a lineHTML 样式：无法右对齐一行的后半部分
【发布时间】：2020-12-12 19:58:43
【问题描述】：

我正在自动将乳胶索引转换为 HTML，我生成的代码如下所示：

<div style="float:left;">
    Abricots à la Colbert
    <a style="float:right" href="../text/ch005.xhtml#ix1941">1941</a>
</div>

不幸的是，这不起作用：“1941”页码不会浮动到页面的右侧。整行左对齐，并且在 Colbert 的 't' 之后立即显示页码，中间没有空格。

另一方面，如果我编写如下代码：

<div style="text-align:left;">
This text is left aligned
<span style="float:right;">
    This text is right aligned
</span>
</div>

...一切都按预期进行。

谁能解释一下原因？

编写此代码的正确方法是什么？

【问题讨论】：

标签： html styles right-align

【解决方案1】：

我认为您将整个 div 放在左侧，然后由于 a 标签位于 div 内，您希望将其放在右侧。你可以试试这样：

 <div>
   <div style="float:left;">
      Abricots à la Colbert
   </div>
   <div style="float:right;">
      <a style="float:right" href="../text/ch005.xhtml#ix1941">1941</a>
   </div>
</div>

【讨论】：

Edward Cooper 我按照建议更改了我的代码生成模板，它给出了正确的结果。由于 'float:left / float:right + text 左对齐等'我从另一个问题中复制的东西和我失败的努力具有完全相同的逻辑结构（在
中具有 float:right 属性）......我唯一能想到的是不是由于某种原因，渲染器在设置标签的样式时会忽略 'float:right' 属性。
评论已删除