Search code examples
htmlfooter

Why is this div appearing above the <footer> even though it's below it in the code?


See pics for quick viewing of issue: (http://prnt.sc/eqo56d) (http://prnt.sc/eqo6ab)

Website: http://match.onesquad.nl/

I've made sure all tags are closed in all templates using the footer as well as the footer itself:

<div class="footer">        
    <div class="personeel group">
        <div class="container group">
            <?php echo do_shortcode("[insert page='accountmanagers']"); 
            ?>   
        </div>
    </div>
    <div class="nieuws group">
        <div class="container">
            <?php echo do_shortcode("[insert page='nieuws-front-page']"); ?> 
        </div>
    </div>
    <footer class="group">
        <div class="container">
            <div class="row">
                <section class="col-lg-4 col-md-4 col-sm-12"> 
                    <div class="sectie first">
                        <h3>Over ons</h3>
                        <div class="row">
                            <section class="col-xs-12 col-sm-6"> 
                                <div class="kolom">
                                    <ul>
                                        <li>Over Match</li>
                                        <li>Accountmanagers</li>
                                        <li>Vormen van bemiddeling</li>
                                        <li>Kwaliteit</li>
                                    </ul>
                                </div>
                            </section>
                            <section class="col-xs-12 col-sm-6">
                                <div class="kolom">
                                    <ul>
                                        <li>Branches</li>
                                        <li>Certicering</li>
                                        <li>Match holding</li>
                                        <li>Contact</li>
                                    </ul>
                                </div>
                            </section>
                        </div>
                    </div>
                </section>
                <section class="col-lg-4 col-md-4 col-sm-12"> 
                    <div class="sectie second">
                        <h3>Bedrijven</h3>
                        <ul>
                            <li>Arbeidskrachten</li>
                            <li>Vacature plaatsen</li>
                            <li>Vormen van bemiddeling</li>
                        </ul>
                    </div>
                </section>
                <section class="col-lg-4 col-md-4 col-sm-12"> 
                    <div class="sectie third">
                        <h3>Baan zoeken</h3>
                        <div class="row">
                            <section class="col-xs-12 col-sm-6"> 
                                <div class="kolom">
                                    <ul>
                                        <li>Vacatures</li>
                                        <li>Inschrijven</li>
                                        <li>Werken bij Match</li>
                                        <li>Snel aan de slag</li>
                                    </ul>
                                </div>
                            </section>
                            <section class="col-xs-12 col-sm-6"> 
                                <div class="kolom">
                                    <ul>
                                        <li>Vormen van bemiddeling</li>
                                        <li>CV uploaden</li>
                                    </ul>
                                </div>
                            </section>
                        </div>
                    </div>
                </section>
            </div>
        </div>            
    </footer>
    <div class="copyright">
        <p>Copyright 2017 - Match | Sitemap | Webdesign One Squad</p>
    </div>
</div>

</body>
</html>

Many thanks.


Solution

  • It's because you have floated your footer right. Add clear:right to your .copyright class and it will push the copyright below the footer

    More information on clearing floats