VoxelGod
@VoxelGod
Настройка шаблонов WordPress

Почему пункт списка «уезжает»?

Здравствуйте. Делаю меню на сайте. Каждый пункт меню - круг с иконкой. Круг я делаю средствами css, а иконки добавляю в <div> пункта меню. Прилагаю кусочки кода и результат:

Круг с иконкой уезжает вниз.
68e3641ff1de4bf6a9a37077bb181392.png
HTML:
<div class="main_menu">
<ul>
        <li>
            <div class="circle">
                <img class="home_icon" src="<?php echo bloginfo('template_url'); ?>/pictures/home_icon.png" alt="Picture ERROR">
            </div>
        </li>
<ul>
</div>



CSS:
.circle {
    width: 150px;
    height: 150px;
    background: #f8f991;
    border-radius: 75px;
}

.main_menu {
    text-align: center;
}

.main_menu > ul {
    list-style-type: none;
}

.main_menu > ul > li {
    display: inline-block;
    padding: 30px;
}

.main_menu > ul > li > div > img {
    width: 65%;
    height: 65%;
    margin: 20px;
}




Как можно исправить это "съезжание"?
Буду искренне благодарен за ответ.
Заранее спасибо!
  • Вопрос задан
  • 399 просмотров
Решения вопроса 1
Sanan07
@Sanan07
Писатель-прозаик
Добавляешь vertical-align:top в .main_menu > ul > li
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
mrusklon
@mrusklon
Все могу! Но не сразу....
надо бы весь код посмотреть. Залей на jsfidle
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы