Menu
I am using [email protected] css framework
I have submit button within a form as follows
... <!--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> ... The result is the following
How can I make the button goes full-width ?
459
Creating a full-width button is very simple and easy, just take an <button> element and make it a block element with display: block property and add width: 100% to it. You can use other CSS properties to customize it.
Every element in Bulma is mobile-first and optimizes for vertical reading, so by default on mobile: columns are stacked vertically. the level component will show its children stacked vertically. the nav menu will be hidden.
Add the class 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> is-fullwidth did not work for me, but is-overlay did!
35
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
