Create two unequal columns with Bootstrap Grid Layout

BootstrapWeb DevelopmentCSS Framework

To create two unequal columns with Bootstrap Grid Layout, you can try to run the following code

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>
      <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
      <script src = "/scripts/jquery.min.js"></script>
      <script src = "/bootstrap/js/bootstrap.min.js"></script>
   </head>
   <body>
      <div class = "container-fluid">
         <h2>Bootstrap Grid Unequal Columns</h2>
         <div class = "row">
            <div class = "col-sm-9" style = "background-color:blue; color: white;">Column One</div>
            <div class = "col-sm-3" style = "background-color:red; color: white;">Column Two</div>
         </div>
      </div>
   </body>
</html>
raja
Updated on 12-Jun-2020 19:06:12

Advertisements