背景・実現したいこと

印刷した際の見え方を、アプリ内に表示したく作成しています。
指定したスペースフィールドに 「display: block;」で幅を指定したHTNLを表示したのですが、これは上手く行きました。

ところが、そのスペースフィールドをグループフィールド内に入れたところ、それまで指定した幅に合わせて改行されていた文章が、いっさい改行されなくなってしまいました。

何が原因か分かりますでしょうか。
グループフィールド内にHTMLを表示する場合は、何かCSSの当て方を変える必要があるのでしょうか。

ご教示いただけますと幸いです。よろしくお願い致します。

グループフィールド外と、グループフィード内の同じHTML文章の見え方のイメージ

・グループフィールド外

・グループフィールド内

利用したソースコード（HTML描画JSとCSS）

Java Script：

//印刷プレビュー書き出し-----------------------------------
printPrv +='<div id="output">' //#outpt Start

for (var i = 0; i < headerTxtLst.length; i++) {
printPrv += '<div id="print_pages">'; //#print_pages STRAT
printPrv += headerTxtLst[i];
printPrv += tableHtml[i]
printPrv += '</div>' //#print_pages END
}

printPrv +='</div>' //#outpt END

//画面に表示
printPrvSpace.innerHTML = printPrv;
printSpace.innerHTML = printPrv;

 CSS

 /*ページレイアウト*/
#print_pages {
margin: 0 5%;
}

#print_pages {
display: block; 
page-break-after: always; 
}

#print_pages{
width: 240mm;
height: 370mm;
}