2014-01-02 5 views
0

бит noob здесь. Просто нужно помочь получить это меню в режиме онлайн. В настоящее время он отображается как вертикальный список. Вот соответствующий код:Дисплей: встроенный не работает

#background #header #nav { 
    float: right; 
    list-style-type: none; 
    margin-top: 100px; 
    font-color: #40C8F4; 
} 
#background #header #nav ul { 
    list-style-type: none; 
    list-style-position: inside; 
    display: inline; 
    font-color: #40C8F4; 
    color: #40c8f4; 
} 

#background #header #nav ul li{ 
    text-decoration: none; 
    color: #40C8F4; 
    font-color: #40C8F4; 
    } 
#background #header #nav ul li .scroll { 
    text-decoration: none; 
    color: #40c8f4; 
    display: inline; 
} 
+0

Fiddle будет хорошо. ИЛИ может также добавить ваш html. – Anup

+1

Элементы 'li' являются блочными. Вам также нужно указать 'display: inline' для них. – BenM

+0

Можете ли вы также показать свою структуру HTML. – sandeep

ответ

1

Сделать рядный для Li элемента: -

#background #header #nav ul li{ 
    text-decoration: none; 
    color: #40C8F4; 
    font-color: #40C8F4; 
    display:inline ; 
} 

Это будет работать

+0

Никогда не используйте «! Important». Это плохая практика. – sandeep

+0

Согласитесь, но можете ли вы попробовать, не важно !, Я думаю, что это тоже сработает, и если это сработает и, пожалуйста, удалите мой голос. #background #header #nav ul li { text-decoration : никто; цвет: # 40C8F4; font-color: # 40C8F4; дисплей: встроенный; } –

0

Попробуйте добавить следующее:

#background #header #nav ul li{ 
    text-decoration: none; 
    color: #40C8F4; 
    font-color: #40C8F4; 
    display:inline; 
    float:left; 
} 
0

Использование CSS, но случайный HTML, here is a demo

Поскольку вы используете inline, я предлагаю использовать inline-block по адресу div s, beacuse, таким образом, там по умолчанию display свойство не скомпрометировано, а также вы получаете inline.
div «s являются Bye по умолчанию display:block элементы уровня

CSS

#background #header #nav { 
    float: right; 
    list-style-type: none; 
    margin-top: 100px; 
    font-color: #40C8F4; 
    display: inline-block; /* add this */ 
} 
#background #header #nav ul { 
    list-style-type: none; 
    list-style-position: inside; 
    display: inline; 
    font-color: #40C8F4; 
    color: #40c8f4; 

} 
#background #header #nav ul li { 
    text-decoration: none; 
    color: #40C8F4; 
    font-color: #40C8F4; 
    display: inline-block;/* add this */ 

} 
#background #header #nav ul li .scroll { 
    text-decoration: none; 
    color: #40c8f4; 
    display: inline-block; 
} 
Смежные вопросы