Muhammad Ali Muhammad Ali - 4 months ago 6x
CSS Question

transparent border-top around .panel driving me crazy. Can't find the cause

I am making a template for my website and I have a mysterious transparent line on top of one of the panels. Though i suspect it will be on them all just that the way the parallax works is preventing it from looking bad.

You can view it here its right on top of 'SKILLS'

Any help would be greatly appreciated. :)

I want to basically find the problem thats causing this.


It happen because inside your 'SKILLS' container there is only either empty or floating element. You are using bootstrap so a clearfix should do the trick at the level of col-lg-12 bg-2:

<div class="col-lg-12 bg-2 clearfix">
    <h2 class="profile-header">SKILLS</h2>
    <p class="intro-copy">
        <li><span>Communication: </span> English (Fluent, native), Bahasa Melayu (Learning)</li>
        <li><span>Skills: </span> HTML, CSS, SASS, jQuery, Bootstrap, E-mail Design, Graphic Design
            Learning: JavaScript, Git Version Control, Web APIs </li>
        <li><span>Tools: </span> FTP Clients, Wordpress, Sublime text (with emmet),
            Adobe Photoshop, Adobe Dreamweaver, Brackets, WebStorm IDE,
            Hootsuite, Hubspot, Google AdWords, Pure 360, Drupal, phpMyAdmin,
            Google Analytics, Mailchimp </li>
        <li><span>Operating Systems: </span> Windows, MAC OSX</li>

After that, you can choose the background you want for this block.