Bootstrap dropdown menue: how to make text wrap nicely?

Question

I have searched for my problem, but can not find a solution to mine.

how can I make text wrap in bootstrap 3 drop down menu

here is my html :

           <div class="row"">
                <div class="col-xs-12 col-sm-12">
                    <div class="btn-group btn-block">
                        <button type="button" class="btn btn-primary btn-block btn-lg dropdown-toggle" data-toggle="dropdown">
                          <span id="promotion"></span>  <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu btn-block" role="menu"  >
                            <li ng-repeat="a in model.list">
                                <a ng-bind="a"></a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>

The value of a coming from the database :

If a text gets bigger :

then it breaks my whole page and I can swap the page to the right. If it is a mobile device.

I have tried the solutions in the following question :

Bootstrap dropdown: how to make text wrap nicely

but it did not work for me.

Any Suggestions or any alternatives I can use to have a collapse drop down list in bootstrap twitter 3.

Thanks.