Open In App

Bulma Table Container

Last Updated : 30 Jan, 2022
Improve
Improve
Like Article
Like
Save
Share
Report

The Bulma Table container class is used to set or active the scroll by wrapping up the wider table. To wrap a table with in a container you have to put your table element inside of div element and set class of table-container in the div element.

Bulma Table Container class:

  • table-container: This class is used to create a scrollable table by wrapping a table.

Syntax:

<div class="table-container">
  <table class="table">
    <!-- Your table content -->
  </table>
</div>

Below example Bulma Table container:

Example:

HTML




<!DOCTYPE html>
<html>
  
<head>
    <link rel='stylesheet'
        href=
'https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css'>
</head>
  
<body class="has-text-centered">
    <h1 class="is-size-2 has-text-success" >
        GeeksforGeeks
    </h1>
    <b>Bulma Table Container</b>
    <div class="has-text-left ml-4 mr-4">
        <div class="table-container">
          <table class="table">
            <tbody>
              <tr>
                <td class="tg-0lax">A</td>
                <td class="tg-0lax">B</td>
                <td class="tg-0lax">C</td>
                <td class="tg-0lax">D</td>
                <td class="tg-0lax">E</td>
                <td class="tg-0lax">F</td>
                <td class="tg-0lax">G</td>
                <td class="tg-0lax">H</td>
                <td class="tg-0lax">I</td>
                <td class="tg-0lax">J</td>
                <td class="tg-0lax">K</td>
                <td class="tg-0lax">L</td>
                <td class="tg-0lax">M</td>
                <td class="tg-0lax">N</td>
                <td class="tg-0lax">O</td>
                <td class="tg-0lax">P</td>
                <td class="tg-0lax">Q</td>
                <td class="tg-0lax">R</td>
                <td class="tg-0lax">S</td>
                <td class="tg-0lax">T</td>
                <td class="tg-0lax">U</td>
                <td class="tg-0lax">V</td>
                <td class="tg-0lax">W</td>
                <td class="tg-0lax">X</td>
                <td class="tg-0lax">Y</td>
                <td class="tg-0lax">Z</td>
                <td class="tg-0lax">1</td>
                <td class="tg-0lax">9</td>
                <td class="tg-0lax">9</td>
                <td class="tg-0lax">5</td>
              </tr>
              <tr>
                <td class="tg-0lax">a</td>
                <td class="tg-0lax">b</td>
                <td class="tg-0lax">c</td>
                <td class="tg-0lax">d</td>
                <td class="tg-0lax">e</td>
                <td class="tg-0lax">f</td>
                <td class="tg-0lax">g</td>
                <td class="tg-0lax">h</td>
                <td class="tg-0lax">i</td>
                <td class="tg-0lax">j</td>
                <td class="tg-0lax">k</td>
                <td class="tg-0lax">l</td>
                <td class="tg-0lax">m</td>
                <td class="tg-0lax">n</td>
                <td class="tg-0lax">o</td>
                <td class="tg-0lax">p</td>
                <td class="tg-0lax">q</td>
                <td class="tg-0lax">r</td>
                <td class="tg-0lax">s</td>
                <td class="tg-0lax">t</td>
                <td class="tg-0lax">u</td>
                <td class="tg-0lax">v</td>
                <td class="tg-0lax">w</td>
                <td class="tg-0lax">x</td>
                <td class="tg-0lax">y</td>
                <td class="tg-0lax">z</td>
                <td class="tg-0lax">1</td>
                <td class="tg-0lax">9</td>
                <td class="tg-0lax">9</td>
                <td class="tg-0lax">5</td>
              </tr>
            </tbody>
          </table>
        </div>
    </div>
</body>
  
</html>
 






                        










Output:


Bulma Table container
Bulma Table container


Reference: https://bulma.io/documentation/elements/table/#table-container


                                 


                            

                                

                                    Like Article
                                    
                                

                                

                                    
                                    Suggest improvement
                                

                            


                            

                                                            

                                    
                                        
                                        Previous
                                    
                                    
                                    

                                        Bulma Box Variables
                                    

                                

                                                            

                                    
                                        Next
                                        
                                    
                                    
                                    

                                        Bulma Colors
                                    

                                

                                                        

                            
    

        

            Share your thoughts in the comments
        

        
    
                            

            

                

                    

                    
                
 
                
    
                            

                                

                            


                            


            

        
 
                        

                                                

                        
                                                    

                                

                                    Similar Reads                                    
                                

                                
      
                                    
        
            

                How to move a container inside of another container in Bootstrap 5 ?
            

        
    
        
            

                What is the Difference Between container and container-fluid in Bootstrap 5 ?
            

        
    
        
            

                Bulma Container Widescreen or FullHD only
            

        
    
        
            

                Bulma Container Default Behavior
            

        
    
        
            

                Bulma Container Overview
            

        
    
        
            

                Bulma Font Awesome Container
            

        
    
        
            

                Bulma Container Variables
            

        
    
        
            

                Bulma Container Absolute maximum width
            

        
    
        
            

                Bulma Fluid Container
            

        
    
        
            

                Bulma | Table
            

        
                                    

                            

                                                                        

                                

                                    
                                                                    

                            


                        

                        

                            

                                

                                    

                                        
S

        

            
        

        

                                    


                                    

                                        skyridetim                                

                            

                            

            
                                

                            

                                                                    

                                        
Article Tags : 

                                        
                                    

                                                                                            

                                                                                    

                              

                            

                                                        
                        

                    

                

            

        
        


        

                


			
		
		                
        

    

    

        

            

            

        

    












	

    
  

  
  








    
        We use cookies to ensure you have the best browsing experience on our website. By using our site, you
        acknowledge that you have read and understood our
        Cookie Policy &
        Privacy Policy
            
    







   Lightbox