Как я могу сделать кнопку bulma на всю ширину?

Я использую CSS-фреймворк [email protected].

У меня есть кнопка отправки в форме следующим образом

...
<!--Submit button-->
<div class="columns">
    <div class="column is-full">
        <button type="submit" class="button is-primary">
            <span class="icon"><i class="fa fa-sign-in"></i></span>
            <span>Login</span>
        </button>
    </div>
</div>
...

Результат следующий

введите описание изображения здесь

Как сделать, чтобы кнопка работала на всю ширину?


css bulma css-frameworks
person ira    schedule 06.01.2017    source источник
comment
Я думаю, что is-fullwidth - это класс, который вы ищете   -  person Manu Obre    schedule 06.01.2017
comment
@ManuelObregozo, это правильно, спасибо   -  person ira    schedule 06.01.2017

Ответы (2)


arrow_upward
75
arrow_downward

Добавьте класс is-fullwidth

<button type="submit" class="button is-primary is-fullwidth">
      <span class="icon"><i class="fa fa-sign-in"></i></span>
      <span>Login</span>
</button>
person Manu Obre    schedule 06.01.2017

arrow_upward
2
arrow_downward

is-fullwidth у меня не сработало, а is-overlay сработало!

person Pauls Bebris    schedule 04.10.2018
comment
это звучит как другое. - person Ashnur; 14.11.2018
comment
То же самое случилось со мной. удаление is-grouped из родителя .is-fullwidth исправило это для меня. - person JonTroncoso; 02.06.2019