<div class="container"> <div class="row"> <div class="col-sm-4"> <ul class="nav nav-tabs"> <li class="nav-item"> <a class="nav-link active" data-toggle="tab" href="#step1">Step 1</a> </li> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#step2">Step 2</a> </li> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#step3">Step 3</a> </li> </ul> </div> <div class="col-sm-8"> <div class="tab-content"> <div id="step1" class="tab-pane active"> <div class="card"> <img class="card-img-top" src="path/to/image1.jpg" alt="Step 1 Image"> <div class="card-body"> <h5 class="card-title">Step 1 Title</h5> <p class="card-text">Step 1 Description</p> </div> </div> </div> <div id="step2" class="tab-pane"> <div class="card"> <img class="card-img-top" src="path/to/image2.jpg" alt="Step 2 Image"> <div class="card-body"> <h5 class="card-title">Step 2 Title</h5> <p class="card-text">Step 2 Description</p> </div> </div> </div> <div id="step3" class="tab-pane"> <div class="card"> <img class="card-img-top" src="path/to/image3.jpg" alt="Step 3 Image"> <div class="card-body"> <h5 class="card-title">Step 3 Title</h5> <p class="card-text">Step 3 Description</p> </div> </div> </div> </div> </div> </div> </div>
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)