Grid plugin demo
Bootstrap 3 preset
<p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <div class="grid-container container"> <div class="grid-row row"> <div class="grid-col col-lg-12 col-md-12 col-sm-12 col-xs-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> <div class="grid-row row"> <div class="grid-col col-lg-6 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> <div class="grid-col col-lg-6 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> </div> <p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <p> </p>
Bootstrap 4 preset
<p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <div class="grid-container container"> <div class="grid-row row"> <div class="grid-col col-lg-12 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> <div class="grid-row row"> <div class="grid-col col-lg-6 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> <div class="grid-col col-lg-6 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> </div> <p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <p> </p>
Bootstrap 5 preset
<p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <div class="grid-container container"> <div class="grid-row row"> <div class="grid-col col-lg-12 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> <div class="grid-row row"> <div class="grid-col col-lg-6 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> <div class="grid-col col-lg-6 col-md-12 col-sm-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> </div> <p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <p> </p>
Foundation 5 preset
<p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <div class="grid-container container"> <div class="grid-row row"> <div class="grid-col columns large-12 medium-12 small-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> <div class="grid-row row"> <div class="grid-col columns large-6 medium-12 small-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> <div class="grid-col columns large-6 medium-12 small-12" style="text-align: center;"> <p>Lorem ipsum</p> </div> </div> </div> <p>Lobortis potenti urna leo gravida porttitor curae proin placerat tempus consequat lorem, sem dictumst imperdiet mattis velit congue maximus lectus egestas per orci, posuere dis semper varius ante senectus quisque pretium vivamus fringilla.</p> <p> </p>