CSS 100vh 不占用整个视口

Question

I need help with my css. I wanted the background to take up the entire viewport using 100vh but it's not working. The meta tag for the viewport is already included. The box-sizing is already set up as well. When I tried inspecting the page using the chrome dev tool, there seems to be no margin or padding creating the space below. BTW I'm using Bulma CSS.

<section class="section is-paddingless>
    <div class="columns is-vcentered has-background-primary" style="height: 100vh">
       <div class="column is-4 is-flex">
          <div class="container">Sample text</div>
       </div> 
    </div>
</section>

Answer 1

A. section class attribute has a missing quote symbol " . Change it from: <section class="section is-paddingless> To: <section class="section is-paddingless">

B. Add is-marginless class to the section's child div.

Final html:

<section class="section is-paddingless">
    <div class="columns is-vcentered has-background-primary is-marginless" style="height: 100vh">
       <div class="column is-4 is-flex">
          <div class="container">Sample text</div>
       </div> 
    </div>
  </section>