html - 将滚动横幅中的文本向右对齐的问题

Question

我正在努力使旋转横幅的文本（红色文本）与右侧（社交图标的左侧）对齐。在这里发布代码太长了，所以这里有一个链接，您可以在其中看到它的运行情况（请注意，我使用的是modern-ticker 插件）。

我怀疑这可能来自以下代码（modern-ticker.css 的一部分），但是当我将其更改为float: right文本时消失了。我还尝试了 text-align: 在各个地方都没有成功。谢谢你的帮助！

.mt-news li {
        float: left;
    }

Answer 1

浮动元素与它们的内容一样宽，因此您需要指定它以便与容器一样宽（在这种情况下，容器非常非常宽，但可见区域为 400px 宽）。

.mt-news li {
    width: 400px;
}

---

更多变化

在此示例中，您实际上并不需要父对象非常宽且lis 浮动，因为您正在以一种不会立即显示它们的方式淡化它们。我会推荐：

1. width: 50000px;从中删除ul
2. float: left;从中删除li
3. float: left;从中删除.mt-news

也就是说，如果真实的生活情况与这个例子没有什么不同。