0

私は翡翠で次のものを持っています:

+autoForm(id=decidedChargeBoxForm collection="Products" doc=this type="update" class="form-inline")
    +costFormGroup(name="decidedCharge")

そしてこれをhtmlで:

<template name="costFormGroup">
    <div class="form-group{{#if afFieldIsInvalid name=name}} has-error{{/if}}">
        <div class="input-group">
            <div class="input-group-addon">$</div>
            {{> afFieldInput name=name placeholder="schemaLabel" label=false}}
        </div>
        {{#if afFieldIsInvalid name=name}}
            <span class="help-block">{{afFieldMessage name=name}}</span>
        {{/if}}
    </div>
</template>

ブートストラップのインラインフォームクラスを利用していますが、フォーム要素が全幅に拡張されないように正しく作成されていますが、インラインで表示されていません。代わりに、次の行に分割しています。スクリーンショットは次のとおりです。

フォームが悪い

私はこれを私のcssに投げました:

.form-inline {
    display: inline;
}

期待どおりに機能しますが、なぜステップが必要なのか混乱しています。

.form-inline私の状況では、ブートストラップ クラスのデフォルトの動作でこれを処理するべきではありませんか? この追加の手順を実行する必要があった別の方法は何ですか?

4

1 に答える 1