<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Bootstrap 5 Modal Example</title> <!-- Include Bootstrap CSS --> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"> <style> .vertical-divider { border-right: 1px solid #ccc; height: 100%; margin-right: 10px; margin-left: 10px; padding-right: 10px; padding-left: 10px; box-sizing: border-box; } </style></head><body> <div class="container"> <h3>Bootstrap Vertical line | Divider</h3> <div class="row" style="height:100vh"> <div class="col"> Content on the left </div> <div class="col-auto"> <div class="vertical-divider"></div> </div> <div class="col"> Content on the right </div> </div> </div> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js"></script></body></html>