Dividing page in 2 vertical columns HTML - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:2 Column

  1. HOME
  2. HTML CSS
  3. CSS Layout
  4. 2 Column

Description

Dividing page in 2 vertical columns HTML

Demo Code

ResultView the demo in separate window 

<html lang="en">
 <head> 
  <style>
.grid-container {<!-- w w w  . j av a  2  s. c  o m-->
   display: grid;
   grid-template-columns: 50% 50%;
}
      </style> 
 </head> 
 <body translate="no"> 
  <div class="grid-container"> 
   <div> 
    <p>Some extra content</p> 
    <div id="canvasSec"> 
     <div id="div1"> 
      <canvas id="can1" click=""></canvas> 
     </div> 
    </div> 
   </div> 
   <div> 
    <table> 
     <tbody> 
      <tr> 
       <th>Header</th> 
      </tr> 
      <tr> 
       <th> Header 1</th> 
       <th> Header 2</th> 
       <th> Header 3</th> 
       <th> Header 4</th> 
       <th> Header 5</th> 
       <th> Header 6</th> 
       <th> Header 7</th> 
      </tr> 
     </tbody> 
    </table> 
   </div> 
  </div>  
 </body>
</html>

Related Tutorials