Вертикальное выравнивание двух верхних делителей не работает

0

Может ли кто-нибудь помочь мне с выравниванием двух моих div? Что я сделал не так? У меня есть два встроенных блока в качестве моих div и пытаюсь выровнять их в самой высокой точке элемента бок о бок.

<body>
    <ul id="navbar">
        <li><a href="#skills">Skills</a></li>
        <li><a href="#work">Work</a></li>
        <li><a href="#contact">Contact</a><li>
    </ul>

    <div id="intro">
        <p>HELLO</p>
    </div>

CSS:

#navbar {
display:inline-block;
margin-left:25%;
list-style-type:none;
vertical-align:top;
width:12%;
    }

#intro {
display:inline-block;
width:40%;
vertical-align:top;
}
  • 0
    Можете ли вы попытаться объяснить немного больше о том, чего вы пытаетесь достичь? Вот jsfiddle с вашим кодом. jsfiddle.net/K9K2X
  • 0
    Извините, я сделал огромную ошибку. jsfiddle.net/K9K2X/4 должен связать вас с обновленным. Я пытаюсь выровнять желтое поле с синим сверху. Спасибо за вашу помощь.
Показать ещё 1 комментарий
Теги:
vertical-alignment

2 ответа

0
Лучший ответ

Добавьте margin-top: 0 или любой другой предпочтительный размер (т.е. margin-top: 20px;) для обоих ID.

Ex. http://jsfiddle.net/K9K2X/6/

Поделиться
0 
<ul id="navbar">
 <li><a href="#skills">Skills</a></li>
 <li><a href="#work">Work</a></li>
 <li><a href="#contact">Contact</a></li> <!-- Forgot to close the element -->
</ul>

#navbar li{
    display:inline-block;
    margin-left:25%;
    list-style-type:none;
    vertical-align:top;
    width:12%;
}

Теперь ссылки бок о бок.

http://jsfiddle.net/K9K2X/8/

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню