お世話になっております。
前提・実現したいこと
Androidアプリで、ユーザーに入力してもらう画面を作成中です。
最初はTableで横並びに入力することを考えていました。
文字数が多くなる場合や、改行もあるであろうことを考え、
2個目の図のレイアウトにしようと検討しています。
補足の入力欄にリンクがあれば、リンクをJavascriptで変換し
飛べるようにもしたいと思っています。
聞きたい事
- DIVの高さを固定するにはどうしたら良いのでしょうか
- 添付画像、2個目の図のように入力欄や選択肢を作る場合は
Tableレイアウトにしたほうが良いか(参考までコメント欲しいです)
Tableじゃない場合は、Listにして並べようと思っています。
発生している問題・エラーメッセージ
html
1 <ons-list-header>キャラクター名</ons-list-header> 2 <ons-list-item> 3 <div class="ReDiv" contenteditable="true"> 4 キャラクター名</div> 5 </ons-list-item>
contenteditable設定にしたDIVの高さが可変になってしまい、
改行すると他の内容まで下に下がっていってしまいます。
DIVの高さを固定にしたいと思っています。
<ons-list-item> の中に入れると、謎の空行などが出来ます。
綺麗な表形式(2個目の図)みたいにあらわせるのであれば、
ons-list-itemに入れずに
css
1.ReDiv{ 2width:100%; 3min-height: 100px; 4max-height:300px; 5white-space:pre-wrap; 6overflow:auto; 7}
試したこと
ons-list-item の中から出してみても、状況特に変わらず。
divタブに直接height:300px;など指定してみましたが、特に変わりませんでした。
textareaだと表示が古く、Androidアプリには向かないと思ったのと
ユーザーが編集可能なDIVエリアにヒント表示や、ボタンや、リンクなど
追加したいと思っているためDIVにしています。
textareaについては別途、CSSで良い感じに出来るかどうかは調べる予定です。
補足情報(FW/ツールのバージョンなど)
Monaca、Onsen UI利用
回答1件
あなたの回答
tips
プレビュー