Program:
Output:
When Screen Side Reduce below 992 px:
<!DOCTYPE html>
<html>
<head>
<!-- CSS only -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<style>
.newDiv {
margin: 5px;
height: 200px;
background-color: aqua;
text-align: center;
font-size: large;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-8">
<div class="newDiv">
Left Column 1
</div>
</div>
<div class="col-lg-6 col-md-4">
<div class="newDiv">
Right Column 1
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6 col-md-8">
<div class="newDiv">
Left Column 2
</div>
</div>
<div class="col-lg-6 col-md-4">
<div class="newDiv">
Right Column 2
</div>
</div>
</div>
</div>
</body>
</html>
Output:
When Screen Side Reduce below 992 px:
