Расположите значок внутри элемента надписи справа, используя Bootstrap 4

Question

Я пытаюсь сделать это с помощью значка, который находится внутри элемента метки.

Фотоделал:

Что я получаю:

Это код для этого раздела

<div class="form-group col-6 m-0">
    <label class="my-1 mr-2" for="role"><i class="fas fa-tag"></i> ROLE <span class="ml-auto"><i class="fas fa-question-circle"></i></span></label>
    <select class="custom-select my-1 mr-sm-2 form-control r-0 light s-12" id="role">
        <option value="1">Administrator</option>
    </select>
</div>

В этом span элементе <span class="ml-auto"><i class="fas fa-question-circle"></i></span> я пробовал:

.ml-auto
.text-right
.d-flex .justify-content-end
.float-right
.pull-right

Но, похоже, ни один из них не работает ,

Как заставить элемент i плавать вправо, как показано на фотошопе?

Answer 1

Добавьте d-flex & align-items-center классы к <label>, и в этот момент будет работать .ml-auto:

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" >
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css" rel="stylesheet">

<div class="form-group col-6 m-0">
    <label class="my-1 d-flex align-items-center" for="role"><i class="fas fa-tag mr-2"></i> ROLE <span class="ml-auto"><i class="fas fa-question-circle"></i></span></label>
    <select class="custom-select my-1 mr-sm-2 form-control r-0 light s-12" id="role">
        <option value="1">Administrator</option>
    </select>
</div>

Answer 2

Добавить классы d-flex и align-items-center на этикетке

<div class="form-group col-6 m-0">
                <label class="my-1 d-flex align-items-center" for="role"><i class="fas fa-tag"></i> ROLE <span class="ml-auto"><i class="fas fa-question-circle"></i></span></label>
                <select class="custom-select my-1 mr-sm-2 form-control r-0 light s-12" id="role">
                    <option value="1">Administrator</option>
                </select>
            </div>

Answer 3

Попробуйте и воспользуйтесь классом pull-right