Friendsofcakeのbootstrapプラグインを導入すると、
echo $this->Form->control('title');
といった記述をするだけで次のマークアップを吐いてくれます:
<div class="form-group text required"> <label class="control-label text-left col-sm-2 col-md-2" for="title">Title</label> <div class="col-sm-6 col-md-6"> <input type="text" name="title" required="required" maxlength="255" id="title" class="form-control"> </div> </div>
見栄えは次のようになります:
さて、ラベルを左寄せするにはどうすればよいでしょうか。
もし、全てのラベルを左寄せでいいのであれば、friendsofcakeのソースをいじってしまうのが簡単です。
vendor/friendsofcake/bootstrap-ui/src/View/Helper/FormHelper.php
を開いて、
72行目あたりにある:
'label' => '<label class="control-label %s"{{attrs}}>{{text}}{{tooltip}}</label>',
を次のように変更します:
'label' => '<label class="control-label text-left %s"{{attrs}}>{{text}}{{tooltip}}</label>',
そして、自前のCSSファイルを作成し、
.control-label.text-left { text-align: left; }
とすると、ラベルが左寄せになります。