如何缩短bulma输入？

Answer 1

小解决方法：使用列

<div class="container">
    <div class="columns">
      <div class="column is-one-fifth">
        <div class="control has-icons-left has-icons-right">
          <input class="input" type="text" placeholder="Exxxxx">
          <span class="icon is-small is-left">
            <i class="fa fa-envelope"></i>
          </span>
          <span class="icon is-small is-right">
            <i class="fa fa-check"></i>
          </span>
        </div>
      </div>
    </div>
  </div>

结果：

Answer 2

如果输入的类型为文本、搜索、电话、网址、电子邮件和密码，则可以使用 size 属性。 （例如不适用于类型编号）。

 <input class="input is-small" size="5" type="text">

Answer 3

您可以添加

style="width: 33%;"

作为输入

<input class="input is-small m-r-5" type="text" style="width: 33%;" placeholder="Exxxxx">

Answer 4

您可以为容器类添加

style="width: 33%"

<div class="container" style="width:33%">
<div class="control has-icons-left has-icons-right" style="width:33%">
    <input class="input is-small m-r-5" type="text" placeholder="Exxxxx">
    <span class="icon is-small is-left">
        <i class="fa fa-envelope"></i>
    </span>
    <span class="icon is-small is-right">
        <i class="fa fa-check"></i>
    </span>
</div>
</div>