Uczę się Bootstrap. Chciałbym mieć przycisk z rozwijaną listą, taki jak poniżej:

<div class="btn-group">
  <a class="btn dropdown-toggle btn-mini" data-toggle="dropdown" href="#">
    Action
    <span class="caret"></span>
  </a>
  <div class="dropdown-menu" style="width: 300px;">
    <div >

  Long text goes here.

    </div>
  </div>
</div>

Zamiast rozwijanego menu mam<div> z długim tekstem i innymi tagami HTML. Problem polega na tym, że próbowałem różnych reguł CSS, a długi tekst wykracza poza<div> lub powoduje wyświetlenie pasków przewijania. Chcę po prostu ładnie zawijać tekst w obrębie<div> i spada w zależności od ilości tekstu.

Jak mogę to zrobić?

Czy korzystam z komponentu „rozwijanego menu” w niewłaściwy sposób?