Центрирующий значок внутри кнопки с плавающей точкой - PullRequest
0 голосов
/ 09 июля 2019

Как я могу расположить этот значок внутри плавающей кнопки?

Я пробовал

display:inline-block;
text-align: center;
vertical-align: middle;

но это не решило проблему.

.float {
  position: fixed;
  width: 56px;
  height: 56px;
  bottom: 24px;
  right: 16px;
  background-color: blue;
  color: #FFF;
  border-radius: 50px;
  text-align: center;
  box-shadow: 2px 2px 3px #999;
  z-index: 1;
}

.my-float {
  font-size: 24px;
  z-index: 1;
}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet" />

<a href="#" class="float">
  <i class="fa fa-plus my-float"></i>
</a>

1 Ответ

0 голосов
/ 09 июля 2019

Попробуйте добавить следующие правила к кнопке float_add или float_edit

display: flex;
justify-content: center;
align-items: center;
...