css Bulma：选择和输入并排，宽度相同

roejwanj 于 2022-11-19 发布在其他

关注(0)|答案(1)|浏览(117)

我正在尝试将宽度相同的选择字段和输入字段并排放置。

<link href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css" rel="stylesheet" />

<div class="field-body">
  <div class="field is-fullwidth">
    <input class="input" type="number" placeholder="Name">
  </div>
  <div class="field has-addons">
    <div class="control is-expanded">
      <div class="select is-fullwidth">
        <select style="flex-basis: 0">
          <option>Choose..</option>
          <option>...</option>
        </select>
      </div>
    </div>
  </div>
</div>

css

来源：https://stackoverflow.com/questions/64367539/bulma-select-and-input-next-to-each-other-with-the-same-width

1条答案

按热度按时间

pbpqsu0x1#

最后一个关于Bulma表单示例doc：

<div class="field is-horizontal">  
  <div class="field-body">
    <div class="field">
      <p class="control is-expanded has-icons-left">
        <input class="input" type="text" placeholder="Name">
        <span class="icon is-small is-left">
          <i class="fas fa-user"></i>
        </span>
      </p>
    </div>
    <div class="field">
      <p class="control is-expanded has-icons-left has-icons-right">
        <input class="input is-success" type="email" placeholder="Email" value="">
        <span class="icon is-small is-left">
          <i class="fas fa-envelope"></i>
        </span>
        <span class="icon is-small is-right">
          <i class="fas fa-check"></i>
        </span>
      </p>
    </div>
  </div>
</div>

赞(0）回复(0）举报 2022-11-19

我来回答

css Bulma：选择和输入并排，宽度相同

1条答案

相关问题

热门标签

最新问答