Потяните значок вправо и вставьте текст? - PullRequest
Новая
       11

Потяните значок вправо и вставьте текст?

0 голосов
/ 03 октября 2019

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

Куда я иду не так? 

.featuresCard{
width: 80vw;
padding: 12px;
margin-bottom: 15px!important;
color: white;
background-color: #e74c3c!important;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css" rel="stylesheet"/>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>



<div id='results1' class="card results1 resultsList featuresCard" >Item 1 <i class="pull-right fa fa-check"></i> </div>

<div id='results2' class="card results2 resultsList featuresCard"> Item 2 <i class="pull-right fa fa-check"></i></div>

<div id='results3' class="card results3 resultsList featuresCard"> Item 3 <i class="pull-right fa fa-check"></i></div>

1 Ответ

2 голосов
/ 03 октября 2019

Я бы посоветовал вам взглянуть на flexbox, довольно крутые вещи. Если вы хотите, чтобы текст и значок находились рядом друг с другом, просто удалите justify-content.

Проверьте это здесь: https://jsfiddle.net/xwh59uy6/1/

display: flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: space-between !important;
...