Как центрировать список значков на одной строке?

Question

Как центрировать список значков на одной строке?

0

У меня есть список значков, которые я хочу отобразить на одной строке. Я продолжаю получать значки, выровненные слева, но не центрированные на странице. есть идеи?

Вот мой код

! - Список икон ->

<!-- 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>

user3413720 13 март 2014, в 06:46

Источник

2

Ваш вопрос не ясен. Пожалуйста, положите его в скрипку
Ashoka Mondal 13 март 2014, в 05:12

Теги:

html

css

2 ответа

Ещё вопросы

Ваш вопрос не ясен. Пожалуйста, положите его в скрипку

Guru · Answer 1 · 2014-03-13T05-00-00.000Z

оберните вашу ul в div, дайте ширину 100% для div и примените правило css text-align: center; Проверьте этот jsfiddle

text-align: center;

Надеюсь, что это поможет вам :)

Kirill Zhukov · Answer 2 · 2014-03-13T04-23-00.000Z

Попробуйте поместить значки влево.

.overview, .animated, .entrance {
   float: left;
}

Или отображать значки как встроенные блоки:

.overview, .animated, .entrance {
   display: inline-block;
}