Okay
  Public Ticket #832356
full width vs medium width
Closed

Comments

  • Infinite Technology started the conversation

    I'm trying to get a counter section I created to display the full width of the page instead of just the middle of the page.  I have tried changing div class to fullsize but no luck.  The website is here www.flwbarchitects.com and the code is below:

    <!-- Parallax Container -->                            
                <div class="parallax parallax-background8">
                        <div class="bg-overlay bg-color-dark"></div>
                    <div class="white-space space-big"></div>
                        <div class="container">
                               <div class="row">
                                   <div class="col-md-8 col-md-offset-2">
                                    <p class="lead text-center color-white">Designing a beautiful building is good. Cultivating a long lasting Client relationship is great.</p>
                                    <div class="white-space space-medium"></div>
                                </div>
                            </div>                        
                            <div class="row">
                                   <div class="col-md-3 col-sm-6">
                                    <h2 class="text-center color-white animation zoomIn"><i class="icon icon-brush-paint-streamline"></i></h2>
                                    <h2 class="counter text-center color-white">16</h2>
                                    <h4 class="text-center color-white">JOBS IN Progress</h4>
                                    <div class="white-space space-big"></div>
                                </div>
                                <div class="col-md-3 col-sm-6">
                                    <h2 class="text-center color-white animation zoomIn"><i class="icon icon-stamp-streamline"></i></h2>
                                    <h2 class="counter text-center color-white">716</h2>
                                       <h4 class="text-center color-white">Completed projects</h4>
                                    <div class="white-space space-big"></div>
                                </div>
                                <div class="col-md-3 col-sm-6">
                                    <h2 class="text-center color-white animation zoomIn"><i class="icon icon-magic-magic-wand-streamline"></i></h2>
                                    <h2 class="counter text-center color-white">35</h2>
                                       <h4 class="text-center color-white">Years of Experience</h4>
                                    <div class="white-space space-big"></div>
                                </div>
                                <div class="col-md-3 col-sm-6">
                                    <h2 class="text-center color-white animation zoomIn"><i class="icon icon-like-love-streamline"></i></h2>
                                    <h2 class="counter text-center color-white">90</h2>
                                       <h4 class="text-center color-white">% Repeat Clients</h4>
                                    <div class="white-space space-big"></div>
                                </div>
                            </div>
                        </div>
                </div>
                <!-- /Parallax -->

    Thanks for the help!

  • Infinite Technology replied

    Hello!  Please provide an update to this ticket.  Thank you in advance.

  • Infinite Technology replied

    I'll try again reaching out to see if you can assist with my issue below, thanks.

  • Cosmin replied

    Hi, 

    To have a full width section you need your parallax section to be outside the main container. So your page structure should be like  [Container][Parallax Section][Container].

    The idea is not to hold the parallax div inside a container.

    Let me know if this helped.

    Cheers