私はプレstashop1.7.2.1モジュールを作成しています。 Prestashopには、ブートストラップ4がサポートされています。ブートストラップ4検証アイコンは、プレストショップ1.7で入力幅全体を繰り返します。
私は次のコードでの検証例からhttps://v4-alpha.getbootstrap.com/components/forms/#validationから使用しようとしている:
<div class="container">
<form>
<div class="form-group row has-success">
<label for="inputHorizontalSuccess" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control form-control-success" id="inputHorizontalSuccess" placeholder="[email protected]">
<div class="form-control-feedback">Success! You've done it.</div>
<small class="form-text text-muted">Example help text that remains unchanged.</small>
</div>
</div>
<div class="form-group row has-warning">
<label for="inputHorizontalWarning" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control form-control-warning" id="inputHorizontalWarning" placeholder="[email protected]">
<div class="form-control-feedback">Shucks, check the formatting of that and try again.</div>
<small class="form-text text-muted">Example help text that remains unchanged.</small>
</div>
</div>
<div class="form-group row has-danger">
<label for="inputHorizontalDnger" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control form-control-danger" id="inputHorizontalDnger" placeholder="[email protected]">
<div class="form-control-feedback">Sorry, that username's taken. Try another?</div>
<small class="form-text text-muted">Example help text that remains unchanged.</small>
</div>
</div>
</form>
</div>
Pingendo 4
を使用して(4デスクトップアプリエディタをブートストラップ)、それが正常に動作します。 しかし、このコードを私のprestashopモジュールに追加すると、すべての入力に入力の幅全体にわたって繰り返される検証アイコンが含まれています。
任意のアイデア?
私はfolowingを.form-controlクラスに追加する必要がありました:background-repeat:no-repeat;背景位置:右;ありがとう! – ufk