How To Create vertical line between columns using bootstrap?

Today, We want to share with you bootstrap vertical divider.In this post we will show you How To Create a Vertical Line?, hear for bootstrap vertical line between columns we will give you demo and example for implement.In this post, we will learn about bootstrap filter dropdown with an example.

Bootstrap 3 Horizontal and Vertical Divider

Bootstrap Horizontal Divider : Between Rows

Bootstrap Vertical and Horizontal Divider : Example

<style type="text/css">
.h-divider{
 margin-top:5px;
 margin-bottom:5px;
 height:1px;
 width:100%;
 border-top:1px solid gray;
}
</style>
<div class="row">
    <div class="col-xs-3">Data I Love You 1</div>
    <div class="col-xs-2">Data I Love You 2</div>
    <div class="col-xs-2">Data I Love You 2</div>
    <div class="col-xs-3">Data I Love You 3</div>
    <div class="col-xs-3">Data I Love You 4</div>
</div>
<div class="h-divider">
</div>
<div class="row">
    <div class="col-xs-3">Data I Love You 1</div>
    <div class="col-xs-3">Data I Love You 2</div>
    <div class="col-xs-3">Data I Love You 3</div>
    <div class="col-xs-3">Data I Love You 4</div>
</div>

Bootstrap Vertical Divider : Between Columns

index.html

<style type="text/css">
.v-divider{
 margin-left:5px;
 margin-right:5px;
 width:1px;
 height:100%;
 border-left:1px solid gray;
}
</style>
<div class="row">
    <div class="col-xs-3">Data I Love You 1</div>
    <div class="col-xs-2">Data I Love You 2</div>
    <div class="col-xs-2 v-divider">Data I Love You 2</div>
    <div class="col-xs-3">Data I Love You 3</div>
    <div class="col-xs-3">Data I Love You 4</div>
</div>

I hope you get an idea about vertical divider css.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

Pakainfo

I am Jaydeep Gondaliya , a software engineer, the founder and the person running Pakainfo. I’m a full-stack developer, entrepreneur and owner of Pakainfo.com. I live in India and I love to write tutorials and tips that can help to other artisan, a Passionate Blogger, who love to share the informative content on PHP, JavaScript, jQuery, Laravel, CodeIgniter, VueJS, AngularJS and Bootstrap from the early stage.

Also Read This 👉   onclick image zoom jquery demo - Click/Tap To Smooth Zoom Images – Image Zoom Plugin