Шрифт awesome center horizontally

Question

Так что по какой-то причине я просто не могу поместить свои значки в центр div, в который они завернуты. Я попробовал обернуть их в div, вызвав их непосредственно в css, много css-комбинаций и родительские классы просто не сдвинутся с места. Единственный способ заставить меня двигаться, добавив «margin-left», который просто невелик в этой отзывчивой дизайнерской ситуации.

Вот мой HTML:

<div class="col-lg-4 col-md-4 col-sm-12 col-xs-12"> 
    <i class="icon-code"> </i> 
    <p class="service-description"> 
     Bacon ipsum dolor sit amet ribeye ham kielbasa, pork ball tip jowl pancetta kevin andouille capicola pastrami frankfurter short ribs tenderloin pork chop. 
    </p> 
</div> 

Вот мой CSS:

.service-icons{ 
    margin-top:6%; 
} 
.service-icons i{ 
    text-align: center; 
    vertical-align: middle; 
    font-color:#c1c1c1; 
    color:#c1c1c1; 
    font-size:72px; 
    transition: all 0.3s ease-in-out 0s; 
} 
.icon-code i{ 
    text-align: center; 
} 
.service-icons i:hover{ 
    -webkit-transform: scale(0.9, 0.9); 
    -ms-transform: scale(0.9, 0.9); 
    transform: scale(0.9, 0.9); 
    opacity:0.7; 
} 

Для живого демо - Click here

Answer 1

Добавить text-align:center до <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">

Answer 2

Попробуйте использовать: margin-left: auto; margin-right: auto, что следует сосредоточить его в середине страница/любой контейнер, в котором он находится.