iframeの大きさをwidthとheightで指定し,スクロールバーを表示するようにすると,iPadなど,iosのsafariで表示させたとき,width,heightが無視され,iframeの中身の大きさで表示されてしまいます。
いろいろ試行錯誤し,NetCommons上でこの症状を回避しつつ,もともとの見栄えに近いものにするには,iframeをdivで囲み,下のようなコードにするとよいことが分かりました。
例によって,NetCommonsの共通エディタでは,<style>は小分けにする必要があります。また,<div style="~">のように記述すると,共通エディタによって自動修正され,"-webkit-overflow-scrolling:touch;"などが消えてしまいますので,<style></style>の形で記述する必要があります。
Haederエリアの「お知らせ」に仕込んでおけば,すべての記事で有効になるので便利だと思います。
<style>
.iframe-container {
overflow:auto;
border-style:inset;
-webkit-overflow-scrolling:touch;
}
</style>
<style>
.iframe {
width:100%;
height:100%;
border:none;
}
</style>
<div class="iframe-container" style="width:700px;height:500px;">
<iframe class="iframe" src="./?action=common_download_main&upload_id=144">
</iframe>
</div>