HTML CSS LI Wrapping

Question

Ho un menu verticale nel mio sistema che è fondamentalmente fatto di HTML ul / li con stile CSS (vedi immagine sotto). Tuttavia, non voglio che gli elementi li che siano più larghi del menu siano avvolti, preferirei che traboccassero con una barra di scorrimento orizzontale nella parte inferiore del menu. Come posso farlo in CSS?

Answer 1

ul {
  overflow: auto;  // allow li's to overflow w/ scroll bar
                   // at the bottom of the menu
}

li {
  white-space: nowrap; // stop the wrapping in the first place
}

Answer 2

Usa white-space: nowrap . In questo modo:

li {
  white-space:nowrap;
}

Ecco un po 'di documentazione .

Answer 3

Dovresti anche dare lo stile ul:

ul{
 width:250px;
 overflow:auto;
}