Q&A
画面レイアウトの話なのでSpringの要素は排除して話を進めた方が良いと思います。
また、コードからするとBootStrap利用でしょうか？
それならBootStrapのタグもつけてください。バージョンも記載してください。
Spring Tool Suite バージョン4 で
Bootstrap バージョン3.3.2
メールアドレスと、メールアドレス入力画面、権限と、プルダウン画面を全て横並びにしたく、
src/main/resources/staticのcssファイルにstyle.cssファイルを作成、
src/main/resources/templates/passwordのresetPassword.htmlファイルに
html
1 2<!DOCTYPE html> 3<html xmlns:th="http://www.thymeleaf.org" 4 th:replace="~{common/login-layout :: layout(~{::title},~{::body/content()})}"> 5<head> 6<meta charset="UTF-8" /> 7<title>パスワードを忘れた方 | LMS</title> 8 <link th:href="@{/css/style.css}" rel="stylesheet" > 9</head> 10<body> 11 12 <h2>パスワード再設定</h2> 13 <div class="well bs-component"> 14 15 企業担当者の方：<br> エントリー時にご登録頂いたメールアドレスをご入力して頂きますと、5分～10分後に 16 パスワード再設定についてのメールを送付致します。<br> <br> 育成担当者の方：<br> 17 ご本人がパスワードを再設定することはできませんので、お手数ですが東京ITスクール事務局に再発行を依頼するようお願い致します。<br> 18 <br> 受講生の方：<br> 19 ご本人がパスワードを再設定することはできませんので、お手数ですが講師に再発行を依頼するようお願い致します。<br> <br> 20 21 <!-- メールアドレス送信フォーム 22 送信ボタンを押すとcomplete画面に遷移する--> 23 <form class="form-horizontal" th:method="post" th:action="@{/password/resetPassword/complete}" th:object="${mailAddressForm}"> 24 <fieldset> 25 26 <div class="form-group" > 27 28 <label for="mailAddress" class="col-lg-2 control-label">メールアドレス</label> 29 <div class="col-lg-10"> 30 <input type="text" class="form-control" th:name="mailAddress" th:value="*{mailAddress}" id="mailAddress" th:errorclass="errorInput" /> 31 <span th:errors="*{mailAddress}" class="help-inline error"></span> 32 </div> 33 <!--権限のプルダウン --> 34 <div class="pull-down"> 35 <label>権限</label> 36 <select th:name="e" th:value="受講生" style=width:150px;> 37 <option th:value="${STUDENT}">受講生</option> 38 <option th:value="${TEACHER}">講師</option> 39 <option th:value="${COMPANY_SUBSIDY}">企業担当者</option> 40 <option th:value="${ADMIN}">管理者</option> 41 <option th:value="${COMPANY_TRAINING}">育成担当者</option> 42 </select> 43 44 45 </div> 46 </div> 47 48 <div class="form-group"> 49 <div class="col-lg-10 col-lg-offset-2"> 50 <strong th:if="${sendFlg}" class="text-danger">メール送信フラグがオフになっています。メールは送信されません！！</strong> 51 <input type="submit" class="btn btn-primary" value="送信" /> 52 </div> 53 </div> 54 55 </fieldset> 56 </form> 57 </div> 58</body> 59</html>
css
1@charset "utf-8"; 2.well bs-component{ 3 display: flex; 4} 5 6 7.pull-down{ 8 style=text-align:right; 9}
かしこまりました。
なぜ「CSSを使わないで」なのでしょうか？
form-horizontal を使っているということは、バージョン3でしょうか？
あ、追記されてたのですね。
なぜ「CSSを使わないで」なのでしょうか？
→CSSを使うとCSSが反映されないからです。
質問を編集いたしました。
BootstrapはCSSフレームワークです。
要件だいぶ変わりましたね。
レイアウトの質問ではなくSpring、thymeleafの質問になりました。既についている回答が全く無意味になってしまっています。
回答者を振り回すだけになっているので、もう少しきちんと解決したいことを整理されたほうが良いでしょう。
かしこまりました。
申し訳ございません。
回答1件
0
表であればテーブルで処理できますが、見た目の調整だけのためにテーブルを利用することは推奨されません
CSSを使わないという条件も今ひとつ何をしたいかわかりません
投稿2022/04/15 02:02
総合スコア114839
あなたの回答
tips
プレビュー
