Question

I’ve got some HTML:

<nav>
    <ul>
        <li>Menu Item One</li>
        <li>Menu Item Two</li>
        <li>Menu Item Three</li>
    </ul>
</nav>

This is styled as a horizontal menu. The number of links in my list are such that the nav needs to drop down to two lines. But I don’t want it to drop at a place mid-li. Which is to say that because my links are multi-word, it tends to drop in the middle of an item. Any way to do this that forces the next line to always be at a place in-between the <li> elements?

Answer 1

just add the css white-space:nowrap; to the li’s