Home / Programmazione / HTML - CSS / Dropdown menu scrollable
Mattepuffo

Dropdown menu scrollable

Dropdown menu scrollable

I menu dropdown sono usati praticamente ovunque, ma soffrono di un problema di visualizzazione quando ci sono troppe voci.

Una soluzione è rendere il menu scrollabile, impostando una altezza massima.

Vediamo un esempio.

Questo l'HTML; le voci vengono presi da un db attraverso PHP:

<ul id="ul_causali" class="dropdown">
   <?php foreach ($arrayData as $var): ?>
      <li><?php echo $var['nome']; ?> </li>
   <?php endforeach; ?>
</ul>

Questo invece il CSS:

#ul_causali { max-height: 600px;overflow-y: scroll; }

Impostiamo una altezza massima, e poi lo rendiamo "scorrevole" in verticale.

Molto easy.

Enjoy!