Free Online Form Builder

Create online forms for free.
Try JotForm Form Builder

Stay Updated

Subscribe to Bootsnipp newsletter. (only important updates will be sent, your email is never shared or sold to anyone else)

Recent Comments

Hi kanks, I fixed the code. You can look.
Bootstrap Draggable Row Table

I'm not sure my version, but the online demo doesn't work either.
Funky Radio/Checkbox Buttons V2.0

replace HREF with DATA-TARGET
Responsive bs-carousel with hero headers

are you using Bootstrap 3.3.0?
Funky Radio/Checkbox Buttons V2.0

Why this snippet doesn't work now?
Funky Radio/Checkbox Buttons V2.0

Hello I try to use with this template , I copy the html page and the css page from the tabs to my page but it dont work find.the menu is not collapsed open .

I'm trying to create two tabs containers one of them are used to describe the content of a set of files and the second are used as a list of download links for the described what I did is try to control the two containers using one tab only, I saw a solution used {data-trigger} with two ID's like data-trigger="#TabA1, #TabB1" but it seems this option is not working with bootstrap 4.x, so is there any solution or workaround to solve this issue.anyway here is my code, if anyone can help me in this.<div class="row"> <div class="col-sm-8"> <div class="card text-center "> <div class="card-header"> <ul class="nav nav-tabs card-header-tabs"> <li class="nav-item"> <a class="nav-link active" href="#TabA1" data-trigger="#A1, #B1" data-toggle="tab" role="tab" aria-selected="true">A1/B1</a> </li> <li class="nav-item"> <a class="nav-link" href="#TabA2" data-trigger="#A2, #B2" data-toggle="tab" role="tab" aria-selected="false">A2/B2</a> </li> <li class="nav-item"> <a class="nav-link" href="#TabA3" data-trigger="#A3, #B3" data-toggle="tab" role="tab" aria-selected="false">A3/B3</a> </li> <li class="nav-item"> <a class="nav-link" href="#TabA4" data-trigger="#A4, #B4" data-toggle="tab" role="tab" aria-selected="false">A4/B4</a> </li> </ul> </div> <div class="card-body" style="text-align: left; overflow-y: scroll; max-height: 600px;"> <div class="tab-content" id="myTabContent_A"> <div class="tab-pane fade show active" id="TabA1" role="tabpanel"> A1 </div> <div class="tab-pane fade" id="TabA2" role="tabpanel"> A2 </div> <div class="tab-pane fade" id="TabA3" role="tabpanel"> A3 </div> <div class="tab-pane fade" id="TabA4" role="tabpanel"> A4 </div> </div> </div> </div> </div> <div class="col-sm-4"> <div class="card"> <h5 class="card-header">Files</h5> <div class="card-body"> <h5 class="card-title"></h5> <div class="tab-content" id="myTabContent_B"> <div class="tab-pane fade show active" id="TabB1" role="tabpanel"> B1 </div> <div class="tab-pane fade" id="TabB2" role="tabpanel"> B2 </div> <div class="tab-pane fade" id="TabB3" role="tabpanel"> B3 </div> <div class="tab-pane fade" id="TabB4" role="tabpanel"> B4 </div> </div> </div> </div> </div></div> with the mentioned HTML code only I can see changes happened to the first tabs container. but I expected to see the changes happened in both of the containers A and B.see the demo:
Bootstrap Community, frontend Development

Problem solved. Simply adding <div class="caption"><p>Image Title</p></div> inside each image div was the answer. That was actually the first thing I tried before posting here earlier today, but I must have made a mistake, as it messed up the gallery with duplicated images. When I tried it again an hour ago, all was well.
Full Responsive CSS Masonry Grid Gallery Or Blog

Is it possible to use <input> inside <td> for serial number (#)? If yes can you please tell me how? like <td><input type="text" name="abc" id="index"></td>
Bootstrap Draggable Row Table

Hi AminulDev,I like your image gallery a lot, but I am struggling to find a way to make it accept captions for each image. Are you able to offer any advice on that?Regards,David
Full Responsive CSS Masonry Grid Gallery Or Blog

Considering A New Car?

You should consider a Tesla. Get 6 Months Free Supercharging.

Tesla Referral Code