response- bootstrap Кнопка выравнивания двухстрочного текста в элементе div со значком в одной строке или строке - PullRequest
0 голосов
/ 07 февраля 2020

У меня есть кнопка с иконкой с двумя строками, в которую я добавил ломать линию. Пока что кнопка отображает 3 строки. значок находится в верхней строке, следующая строка - первое предложение, а второе предложение - в третьей строке. Я нажал F12 и добавил text-align: left на .btn, и это потянуло влево по тексту внутри div, но я предпочитаю не использовать .btn в моем css файле, чтобы избежать влияния на другие кнопки. Я попробовал пользовательский класс css, но это не работает.

Мои мысли заключаются в переносе двух предложений в div и использовании пользовательского класса css для pull-left, который я пробовал с className = "pull-left", но не работает. Я думаю, мне нужно поместить значок и тексты div в другой div, чтобы выровнять значок и текст в одном ряду, но я не уверен, как это сделать.

Любая помощь приветствуется

JSX

<Button className={myStyle.iconButton}>
  <i className="fa fa-user"/>
  {"This is the first sentence"}<br/>
  {"This is the second sentence"}
</Button>

CSS

.iconButton: цвет: # 000000 выравнивание текста: слева! Важно

...