У меня есть список значков, которые я хочу отобразить на одной строке. Я продолжаю получать значки, выровненные слева, но не центрированные на странице. есть идеи?
Вот мой код
! - Список икон ->
<!-- Single Icon -->
<li class="overview animated entrance" data-appear-bottom-offset="100">
<!-- Feature List -->
[tooltip] [ul class=feature-list]
[list-item spanclass=list-dot]Wireframing[/list-item]
[list-item spanclass=list-dot]Content Strategy[/list-item]
[list-item spanclass=list-dot]Information Architecture[/list-item]
[/ul] [/tooltip]
<!-- Icon -->
[icon-img name=ux title=UX][/icon-img]
</li>
<!-- Single Icon -->
<li class="overview animated entrance" data-appear-bottom-offset="100">
<!-- Feature List -->
[tooltip] [ul class=feature-list]
[list-item spanclass=list-dot]Cloud[/list-item]
[list-item spanclass=list-dot]Mobile Payment[/list-item]
[list-item spanclass=list-dot]iBeacon[/list-item]
[/ul] [/tooltip]
<!-- Icon -->
[icon-img name=tech title=Tech][/icon-img]
</li>
<!-- Single Icon -->
<li class="overview animated entrance" data-appear-bottom-offset="100">
<!-- Feature List -->
[tooltip] [ul class=feature-list]
[list-item spanclass=list-dot]Facebook[/list-item]
[list-item spanclass=list-dot]Google +[/list-item]
[list-item spanclass=list-dot]Twitter[/list-item]
[/ul] [/tooltip]
<!-- Icon -->
[icon-img name=social title=Social][/icon-img]
</li>
оберните вашу ul в div, дайте ширину 100% для div и примените правило css text-align: center; Проверьте этот jsfiddle
text-align: center;
Надеюсь, что это поможет вам :)
Попробуйте поместить значки влево.
.overview, .animated, .entrance {
float: left;
}
Или отображать значки как встроенные блоки:
.overview, .animated, .entrance {
display: inline-block;
}