CakePhp-Bootstrap提交按钮不会与文本框对齐

时间:2016-06-25 02:22:43

标签: html css twitter-bootstrap cakephp

我无法让我的按钮与我的文本框对齐。请参阅代码和图像以获得更清晰的理解。我的班级和东西有什么问题吗?

enter image description here 这是我的CTP / HTML

<div class="row">
<div class="col-xs-2">
<ul class="nav nav-sidebar">
    <h3><?= 'Actions' ?></h3>
    <li><?= $this->Html->link('New Bookmark', ['action' => 'add']) ?></li>
    <li><?= $this->Html->link('New User', ['controller' => 'Users', 'action' => 'add']) ?></li>
    <li><?= $this->Html->link('New Tag', ['controller' => 'Tags', 'action' => 'add']) ?></li>
</ul>
</div>
<div class="col-xs-9" style="box-shadow: -8px 0px 6px -6px #3C5791;">
<?= $this->Form->create($bookmark) ?>
<legend><?= 'Add Bookmark' ?></legend>
<div class='form-horizontal'>
    <div class="form-group">
        <?= $this->Form->input('user_id', ['options' => $users, 'class'=>'form-control', 'style'=>'width:30%',
                                           'label'=>['class'=>'col-xs-2 control-label']]); ?>
    </div>
    <div class="form-group">
        <?= $this->Form->input('title', ['class'=>'form-control','style'=>'width:50%',
                                         'label'=>['class'=>'col-xs-2 control-label']]); ?>
    </div>
    <div class="form-group">
    <?= $this->Form->input('description', ['class'=>'form-control','style'=>'width:50%',
                                           'label'=>['class'=>'col-xs-2 control-label']]); ?>
    </div>
    <div class="form-group">
    <?= $this->Form->input('url', ['class'=>'form-control','style'=>'width:50%',
                                   'label'=>['class'=>'col-xs-2 control-label']]); ?>
    </div>
    <div class="form-group">
    <?= $this->Form->input('tags._ids', ['options' => $tags, 'class'=>'form-control','style'=>'width:50%',
                                         'label'=>['class'=>'col-xs-2 control-label']]); ?>
    </div>

    <div class="col-xs-3 col-xs-offset-2">
        <?= $this->Form->button('Submit',['class'=>'btn btn-default']) ?>
        </div>
        <?= $this->Form->end() ?>
        </div>
        </div>
    </div>
</div>

2 个答案:

答案 0 :(得分:2)

您正在为包含按钮的div和其他元素使用不同的CSS类。尝试使用相同的CSS类&#34; from-group&#34;按钮div。

答案 1 :(得分:1)

试试这个:

<div class="form-group">
   <label class="col-xs-2 control-label"></label>
   <?= $this->Form->button('Submit',['class'=>'btn btn-default']) ?>
</div>