0
パネルにフォームをレイアウトしようとしていて、フォーマットに多くの問題があります。ブートストラップを使用したパネルのフォームレイアウト
[保存]ボタンと[電子メール]ラベルの間に改行を入れることができないようです。私は<p>タグを使って動かしてみました。私はフォームインラインとフォーム水平を使用しようとしましたが、状況を悪化させるだけです。
また、テキストボックスの横に[保存]ボタンを配置したいのですが、もう一度これを行うことはできません。例えば、https://jsfiddle.net/omyuzuu3/。
<div class="col-sm-4" id="leftCol">
<div class="panel panel-default">
<div class="panel-body">
<strong>Account Details</strong><p>
<hr>
<form class="form" method="post" >
<div class="form-group">
<label for="exampleInputName2">Username</label><p>
<input name="txtUsername" type="text" class="form-control" placeholder="<?php echo $user->loadUser()->username; ?>">
</div>
<div class="form-group">
<button type="submit" name="btnSaveUsername" class="btn btn-primary btn-sm pull-right">Save</button>
<p>
</div>
<div class="form-group">
<p>
<label for="exampleInputName2">E-mail</label><p>
<input name="txtEmail" type="text" class="form-control" placeholder="<?php echo $user->loadUser()->email; ?>">
</div>
<div class="form-group">
<button type="submit" name="btnSaveEmail" class="btn btn-primary btn-sm pull-right">Save</button>
</div>
</form>
</div>
</div>
</div>
