Горизонтальное выпадающее меню

[luckyguy]

Доброго времени суток!
Подскажите пожалуйста, как выровнять выпадающее меню по горизонтали?
http://codepen.io/anon/pen/wGvBNQ

[VeniVidiVici]

Вы имеете в виду выровнять пункты в подменю?(нужно всего лишь занулить padding для ul)

http://codepen.io/anon/pen/aNbpEP

 

Старайтесь писать html код структурно

<ul>

  <li></li>

  <li></li>

<ul>

а не так:

<ul>

<li></li>

<li></li>

<ul>

Edited February 27, 2016 by VeniVidiVici

[luckyguy]

 

Вы имеете в виду выровнять пункты в подменю?(нужно всего лишь занулить padding для ul)

http://codepen.io/anon/pen/aNbpEP

 

Старайтесь писать html код структурно

<ul>

  <li></li>

  <li></li>

<ul>

а не так:

<ul>

<li></li>

<li></li>

<ul>

 

Я писал структурно в IDE на компьютере, но когда копировал - табуляция не отразилась

Нет, я имел ввиду, что подменю должно быть не столбцом а строкой 

[DivMan]

Это?

http://codepen.io/anon/pen/XdWMEW

[luckyguy]

Это?

http://codepen.io/anon/pen/XdWMEW

Нет, я имел ввиду, что подменю должно быть не столбцом а строкой 

не так:

Amsterdam

Bahamas

Paris

...

London

а вот так:

Amsterdam   Bahamas    Paris    ...    London

[VeniVidiVici]

Как вариант, отменяем перенос текста в подменю

http://codepen.io/anon/pen/EKxWMK

Edited February 27, 2016 by VeniVidiVici

[DivMan]

Тогда лучше заново сверстать

[luckyguy]

Как вариант, отменяем перенос текста в подменю

http://codepen.io/anon/pen/EKxWMK

 Это неправильно, так как оно уезжает за границы nav-a

 

Тогда лучше заново сверстать

Зачем заново верстать, что уже сверстано? и проблема только с одним свойством.

Я просто никак не могу понять каким.

Если, например, задать 

 position: relative;

 для main-menu , а не для .active

тогда оно уже строкой, но всё равно отображение неправильное

[DivMan]

 

Как вариант, отменяем перенос текста в подменю

http://codepen.io/anon/pen/EKxWMK

 Это неправильно, так как оно уезжает за границы nav-a

 

Тогда лучше заново сверстать

Зачем заново верстать, что уже сверстано? и проблема только с одним свойством.

Я просто никак не могу понять каким.

Если, например, задать 

 position: relative;

 для main-menu , а не для .active

тогда оно уже строкой, но всё равно отображение неправильное

 

 

А как тогда должно отображаться? 

[luckyguy]

А как тогда должно отображаться?

 

 

Выпадающее меню не должно выходить за пределы .main-menu

[DivMan]

 

 

 

А как тогда должно отображаться?

 

 

Выпадающее меню не должно выходить за пределы .main-menu

 

А откуда оно должно начинаться с самого левого края или под пунктом? 

[VeniVidiVici]

Выставляете подменю absolute, самому главному меню - relative;

Edited February 28, 2016 by VeniVidiVici

[luckyguy]

А откуда оно должно начинаться с самого левого края или под пунктом? 

 

Вот так получилось http://codepen.io/anon/pen/grOWRZ

Edited February 28, 2016 by luckyguy