javascript - JQuery モバイルの複数行ボタンのオーバーライドの問題

Question

Phonegap と JQuery モバイルを使用して、コンテンツ (キャプション) が ajax 要求を介して取得され、かなり長くなるボタンを使用するアプリを作成しているため、複数行のボタンが必要でした。次の css を使用して検索し、その方法を見つけました。

.ui-btn-inner{
    white-space: normal !important;
}

しかし、私はそれを機能させることができません。

ページの先頭にあるスタイル タグの間に配置してから、 style='' を使用してボタン自体の html コード内に配置しようとしました。また、そのコードをcssファイルに入れてページにリンクしようとしましたが、このファイルをHTMLと同じフォルダーに置いても機能しません。

ボタンを作成する JS の抜粋を次に示します。

for ( var i = 0; i < quizz.questionnaire[index_quest - 1].propositions.length; i++) {
    if (quizz.questionnaire[index_quest - 1].fin) {
        if (i + 1 == quizz.questionnaire[index_quest - 1].reponse) {
            code_source += "<a href='pageFinQz.html' data-role='button' onclick='localStorage.localScore=++score'>";
            code_source += quizz.questionnaire[index_quest - 1].propositions[i];
            code_source += "</a><br/>";
        } else {
            code_source += "<a href='pageFinQz.html' data-role='button'>";
            code_source += quizz.questionnaire[index_quest - 1].propositions[i];
            code_source += "</a><br/>";
        }
    } else if (i + 1 == quizz.questionnaire[index_quest - 1].reponse) {
        code_source += "<a href='#' data-role='button' onclick='mapQuestion(quizz, ++index_quest); localStorage.localScore=++score; return false' rel='external'>";
        code_source += quizz.questionnaire[index_quest - 1].propositions[i];
        code_source += "</a><br/>";
    } else {
        code_source += "<a href='#' data-role='button' onclick='mapQuestion(quizz, ++index_quest); return false' rel='external'>";
        code_source += quizz.questionnaire[index_quest - 1].propositions[i];
        code_source += "</a><br/>";
    }
}

そして、私のHTMLの頭は次のとおりです。

<meta http-equiv="Content-Type" content="text-html" charset="UTF-8"/>
<link rel="stylesheet" type="text/css" href="../lib/jqm/jquery.mobile-1.3.0.css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="../lib/jquery-1.9.1.js"></script>
<script type="text/javascript" src="../lib/cordova-2.4.0.js"></script>
<script type="text/javascript" src="../lib/jqm/jquery.mobile-1.3.0.js"></script>

style.css は私の HTML と同じフォルダーにあり、正確に含まれています:

.ui-btn-inner{
    white-space: normal !important;
}

css は非常に単純なため、なぜ機能しないように見えるのかよくわかりませんが、何か明らかなことを見逃していたのかもしれません。

よろしくお願いします。