CSS将图标向右移动答案

【问题标题】：CSS move Icon to rightCSS将图标向右移动
【发布时间】：2022-02-20 10:02:45
【问题描述】：

我在下面创建了一个带有图标、用户名和电话号码的 UI。我用于 Image 的 CSS 属性是

float: left;
position: relative;
margin-left: 4%;

当我增加 margin-left 时，图像和 usrname 都向右侧移动。我只想将图标向右移动一点。怎么办？

【问题讨论】：

您能否提供您的 HTML 标记以及您在发布的 CSS 中使用的选择器？
对于position:relative，使用left:XXpx 而不是margin-left
请为您的代码提供 jsfiddle 以便我们对其进行编辑并帮助您
Padding-left 可以工作，具体取决于您的代码等。

标签： html css css-float

【解决方案1】：

如果没有确切的标记和您编写 CSS 的上下文，很难给您一个具体的答案。但是，我建议遵循在大多数较新的 CSS 框架中编写的标记和样式，例如 Bootstrap 和 Font Awesome。它们都使用 span 或 i 元素来附加图标，因此您的 HTML 在语义上是有效的。此外，这将使您更灵活地应用您的特定图标样式。

检查 Font Awesome 示例中的 i 元素应该可以让您对一些基本图标样式有一个很好的了解，并且应该可以让您获得所需的外观。

【讨论】：