I can not figure out why, when making the menu, the last two items "move down" http://jsfiddle.net/qxm5B/5/ (visible if you hover the mouse). I assume that this is due to the fact that the menu items are set to the display: inline-block; property display: inline-block; and the items that have come down seem to have “passed” to the next line, but I don’t know, for sure if this is so, and I can’t figure out how to fix it. Tell me, what could be the matter?

    2 answers 2

    Use instead:

     display: inline-block; #nav ul li { float: left; }
    • Yes, thank you very much, it helped)) - Heidel

    You do not need any float. Use vertical alignment.

     #nav ul li { vertical-align: top; ... }