Bulma includes flexible and robust column layout classes. We've included basic examples below, but there are many more options on the Bulma website.
.columns container.column elements as you wantYou can also set specific sizes for your columns (such as .is-two-thirds) and the remaining columns will automatically fill the space.
Bulma supports responsive columns and nested columns as well.
First column
First column
First column
First column
.is-two-thirds
Auto
Auto
<div class="columns">
<div class="column">
<p>First column</p>
</div>
<div class="column">
<p>First column</p>
</div>
<div class="column">
<p>First column</p>
</div>
<div class="column">
<p>First column</p>
</div>
</div>
<div class="columns">
<div class="column is-two-thirds">
<p>.is-two-thirds</p>
</div>
<div class="column">
<p>Auto</p>
</div>
<div class="column">
<p>Auto</p>
</div>
</div>
<div class="masthead">
<nav role="navigation" aria-label="main navigation" class="main-navigation">
<div class="site-logo">
<a href="/">
<img src="logo.png">
</a>
</div>
<ul class="primary-nav">
<li>
<a href="">View My Profile</a>
</li>
<li>
<a href="">My Estimates</a>
</li>
<li>
<a href="" class="is-active" aria-current="page">Update My Data</a>
</li>
<li>
<a href="">Applications</a>
</li>
<li>
<a href="">Help & Support</a>
</li>
</ul>
</nav>
</div>
<section class="hero is-secondary is-medium has-pattern">
<div class="hero-body">
<div class="container has-text-centered">
<h1 class="heading-1">
Personal Data
</h1>
</div>
</div>
</section>
<div class="site-footer">
<div class="inner">
<div class="info">
<p class="copyright">
©2020 YWCA Retirement Fund
</p>
<nav>
<ul>
<li>
<span><a href="/privacy-policy" class="">
Privacy Policy
</a></span>
</li>
</ul>
</nav>
</div>
<div class="connect">
<div class="connect-links">
<h3 class="heading-3 alt">
Resources
</h3> <ul>
<li>
<span><a href="/contact" class="">
Contact
</a></span>
</li>
<li>
<span><a href="/login" class="">
Login
</a></span>
</li>
</ul>
</div>
<div class="connect-links">
<h3 class="heading-3 alt">
Connect
</h3> <ul>
<li>
<span><a href="https://www.facebook.com/ywcarf/" target="_blank" class="button has-icon icon-only social-icon"><span><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="32" height="32" viewBox="0 0 32 32"><path d="M24 6.606h-4.57c-.54 0-1.144.71-1.144 1.662v3.3H24v4.703h-5.714V30.4H12.89V16.272H8v-4.706h4.89V8.8c0-3.97 2.756-7.2 6.54-7.2H24v5.005z" /></svg>
</span> <span class="is-sr-only">Facebook</span></a></span>
</li><li>
<span><a href="https://twitter.com/ywcarf" target="_blank" class="button has-icon icon-only social-icon"><span><svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="32" height="32" viewBox="0 0 32 32"><path d="M30.72 6.87c-1.085.48-2.248.804-3.47.95 1.248-.746 2.206-1.93 2.656-3.34-1.166.69-2.46 1.195-3.834 1.466C24.97 4.772 23.4 4.04 21.662 4.04c-3.336 0-6.04 2.703-6.04 6.037 0 .474.053.934.157 1.376-5.02-.25-9.47-2.656-12.45-6.31-.52.89-.82 1.93-.82 3.037 0 2.096 1.067 3.944 2.688 5.027-.99-.032-1.922-.302-2.736-.755v.075c0 2.926 2.083 5.366 4.845 5.923-.506.138-1.04.21-1.592.21-.39 0-.766-.036-1.136-.106.767 2.4 3 4.146 5.64 4.194-2.066 1.62-4.67 2.586-7.5 2.586-.488 0-.968-.03-1.44-.085 2.672 1.713 5.846 2.713 9.26 2.713 11.108 0 17.183-9.203 17.183-17.186 0-.26-.005-.522-.018-.78 1.18-.852 2.203-1.916 3.014-3.127z" /></svg>
</span> <span class="is-sr-only">Twitter</span></a></span>
</li><li>
<span><a href="https://www.linkedin.com/company/ywca-retirement-fund-inc/" target="_blank" class="button has-icon icon-only social-icon"><span><svg height="512pt" viewBox="0 0 512 512" width="512pt" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="m475.074219 0h-438.148438c-20.394531 0-36.925781 16.53125-36.925781 36.925781v438.148438c0 20.394531 16.53125 36.925781 36.925781 36.925781h438.148438c20.394531 0 36.925781-16.53125 36.925781-36.925781v-438.148438c0-20.394531-16.53125-36.925781-36.925781-36.925781zm-293.464844 387h-62.347656v-187.574219h62.347656zm-31.171875-213.1875h-.40625c-20.921875 0-34.453125-14.402344-34.453125-32.402344 0-18.40625 13.945313-32.410156 35.273437-32.410156 21.328126 0 34.453126 14.003906 34.859376 32.410156 0 18-13.53125 32.402344-35.273438 32.402344zm255.984375 213.1875h-62.339844v-100.347656c0-25.21875-9.027343-42.417969-31.585937-42.417969-17.222656 0-27.480469 11.601563-31.988282 22.800781-1.648437 4.007813-2.050781 9.609375-2.050781 15.214844v104.75h-62.34375s.816407-169.976562 0-187.574219h62.34375v26.558594c8.285157-12.78125 23.109375-30.960937 56.1875-30.960937 41.019531 0 71.777344 26.808593 71.777344 84.421874zm0 0" /></svg>
</span> <span class="is-sr-only">LinkedIn</span></a></span>
</li>
</ul>
</div> <div class="org-address">
<h3 class="heading-3 alt">
Address
</h3>
<a target="blank" href="https://goo.gl/maps/VZz7YiiAMx5iSHS36">
52 Vanderbilt Avenue, 6th Floor<br>
New York, NY 10017
</a>
</div>
</div>
</div>
</div>