- Log inorCreate an account
-
$0
- Item(s) in your cart
-
INCIDIDUNT UT
2 X $199 -
INCIDIDUNT UT
2 X $199 -
Elements
Divider Styles <> show code
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis.
</p>
<hr class="my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis.
</p>
<hr class="divider-dotted brd-gray my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis.
</p>
<hr class="divider-dashed brd-gray my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis.
</p>
<hr class="divider-solid-dbl brd-gray my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis.
</p>
<hr class="divider-dotted-dbl brd-gray my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis.
</p>
<hr class="divider-dashed-dbl brd-gray my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis.
</p>
<hr class="divider-gradient my-4">
How to use
- Use the class names with <hr> shown in exmaple code for the required divider style
Example
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis. Est quas corporis nobis aperiam cumque, minima, libero rem itaque quo vitae odit deserunt cupiditate fugit ipsum, nam quis suscipit tempora recusandae blanditiis porro incidunt maxime soluta. Voluptas, rem.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Divider Width <> show code
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis. Est quas corporis nobis aperiam cumque, minima, libero rem itaque quo vitae odit deserunt cupiditate fugit ipsum, nam quis suscipit tempora recusandae blanditiis porro incidunt maxime soluta. Voluptas, rem.
</p>
<hr class="w25 my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
</p>
<hr class="w50 my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
</p>
<hr class="w75 my-4">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
</p>
How to use
- Use any width class with <hr> for the perticular width of the divider
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis totam, laudantium officia praesentium expedita omnis unde tempora beatae, modi, sequi quis. Est quas corporis nobis aperiam cumque, minima, libero rem itaque quo vitae odit deserunt cupiditate fugit ipsum, nam quis suscipit tempora recusandae blanditiis porro incidunt maxime soluta. Voluptas, rem.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia voluptate voluptatum a fuga, inventore, velit doloremque illum repudiandae, eaque laudantium distinctio aliquid quis rem voluptas in excepturi. Voluptates quam possimus nostrum, cum aspernatur, odit nihil.
Icon Divider <> show code
<div class="divider border-solid divider-center brd-gray my-5">
<i class="fa fa-circle divider-icon bg-white "></i>
</div>
<!-- left align -->
<div class="divider border-solid brd-gray my-5">
<i class="fa fa-circle divider-icon bg-white "></i>
</div>
<!-- Right align -->
<div class="divider border-solid divider-right brd-gray my-5">
<i class="fa fa-circle divider-icon bg-white "></i>
</div>
how to use
- copy paste the above code and you will get the same style. To use another icon just change the icon classname
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi omnis, magni eos! Quis eos deleniti aperiam voluptatibus vel nemo commodi, repellendus harum esse quidem accusamus reprehenderit deserunt ducimus, doloribus, sunt!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi omnis, magni eos! Quis eos deleniti aperiam voluptatibus vel nemo commodi, repellendus harum esse quidem accusamus reprehenderit deserunt ducimus, doloribus, sunt!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi omnis, magni eos! Quis eos deleniti aperiam voluptatibus vel nemo commodi, repellendus harum esse quidem accusamus reprehenderit deserunt ducimus, doloribus, sunt!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi omnis, magni eos! Quis eos deleniti aperiam voluptatibus vel nemo commodi, repellendus harum esse quidem accusamus reprehenderit deserunt ducimus, doloribus, sunt!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi omnis, magni eos! Quis eos deleniti aperiam voluptatibus vel nemo commodi, repellendus harum esse quidem accusamus reprehenderit deserunt ducimus, doloribus, sunt!
Dividers Mixed <> show code
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio ipsum quia, reiciendis tenetur rerum! Consequuntur error quas ex doloribus modi veritatis quam possimus molestiae nesciunt, odio quasi rerum, perferendis rem!</p>
<div class="divider divider-center divider-gradient divider-gradient-gray w50 mx-auto my-5">
<i class="fa fa-circle divider-icon bg-white text-primary"></i>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi tempore doloremque quidem delectus officiis eligendi repellat esse consectetur. Recusandae voluptatem ex odio nisi, odit expedita facilis ducimus est ullam. Dolorum!</p>
<div class="divider divider-center divider-solid-dbl brd-primary w50 mx-auto my-5">
<i class="fa fa-user divider-icon bg-primary text-white"></i>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi tempore doloremque quidem delectus officiis eligendi repellat esse consectetur. Recusandae voluptatem ex odio nisi, odit expedita facilis ducimus est ullam. Dolorum!</p>
how to use
- Copy and paste the above code and you will get the same style. You can use your own classes and override the style properties
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio ipsum quia, reiciendis tenetur rerum! Consequuntur error quas ex doloribus modi veritatis quam possimus molestiae nesciunt, odio quasi rerum, perferendis rem!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi tempore doloremque quidem delectus officiis eligendi repellat esse consectetur. Recusandae voluptatem ex odio nisi, odit expedita facilis ducimus est ullam. Dolorum!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi tempore doloremque quidem delectus officiis eligendi repellat esse consectetur. Recusandae voluptatem ex odio nisi, odit expedita facilis ducimus est ullam. Dolorum!
© 2017 Copyright Bigbag Store Bootstrap Template by Abdus.
