Muhammad Ali Muhammad Ali - 5 months ago 11
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.

http://muhammadkasimali.co.uk/ParallaxCV/

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.

Answer

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">
    </p>
    <ul>
        <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>
    </ul>
    <p></p>
</div>

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

Comments