html - 右对齐引导列表组中的动画 Font Awesome 图标

标签 html css font-awesome bootstrap-4

我正在尝试显示状态列表,其中文本在左侧,结果在右侧。我正在使用 awesome heart 动画字体来展示一颗跳动的心。我希望心脏右对齐但似乎无法使其右对齐:

<div class="row">
    <div class="col-sm-offset-3 col-sm-6 server-dashboard-list">
        <ul class="list-group">
            <li class="list-group-item justify-content-between" >
                Database Up
                <span class="database-up text-colour-red" ><i class="fa fa-heart faa-pulse animated fa-1-5-font-size"></i></span>
            </li>
            <li class="list-group-item justify-content-between">
                Active Database Connections
                <span class="badge badge-pill active-database-connections"></span>
            </li>
        </ul>
    </div>
</div>

徽章是右对齐的,但心脏不是。

最佳答案

您好,我不确定这是否是您想要的,但希望它对您有所帮助...

但是如果你要在一个新类中给出你所拥有的跨度,并且在该类下的 css 中,你可以放置 float: right;。它应该向右移动。

如果您需要更多帮助,请按我的方式打招呼。

关于html - 右对齐引导列表组中的动画 Font Awesome 图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46567534/

相关文章:

php - CSS:图片库的第一行呈对 Angular 线?

javascript - 添加 Font Awesome 图标

php - 使用 PHP 从 HTML 表单收集信息

html - 滚动视口(viewport)时,背景图像在底部或右侧被截断

javascript - 从数据库字段中提取值到复选框值 PHP

css - 我们可以更改 &lt;input type ="file"> 样式吗?

html - 水平居中 DIV 并与顶部或底部保持固定距离,在窗口中不滚动

html - fa 图标不能与#tag_selector * {_CSS_} 一起使用

javascript - Next.js 与 FortAwesome 和 SSR

html - 展开以适应溢出的容器