CODEWITHSUNDEEP
cssnav
João Costa
João Costa

Reputation: 519

Nav margin/ padding

I have this Jsfiddle:

http://jsfiddle.net/JohnnyDevv/XQ5Xd/2/

I'm trying to get zero distance between 2 html5 navs

PHP Example:

    <nav>
        <?php foreach($nav_list  as $id => $nav_item): ?>
            <?php echo anchor(strtolower($id), $nav_item, array('class' => ($nav == $nav_item ? 'active' : ''))) ?>
            </li>
        <?php endforeach ?>
    </nav>
    <img src="<?php echo site_url('_inc/img/divider.png') ?>" width="960" height="4" alt="Divisão de Menu">
    <nav>
        <?php foreach($subnav_list  as $ids => $subnav_item): ?>
            <?php echo anchor(strtolower($ids), $subnav_item, array('class' => ($subnav == $subnav_item ? 'active' : ''))) ?>
            </li>
        <?php endforeach ?>
    </nav>

Here's an example image of what I'm trying to accomplish:

https://lh4.googleusercontent.com/-eyFK3XVSJXc/UKXEt6xUN-I/AAAAAAAAA5A/k-ih3CFDpes/s845/pragas_especies_aranhas.png

Upvotes: 0

Views: 102

Answers (1)

Parker Young
Parker Young

Reputation: 1165

You simply need to add display: block; to the image tag you are using to separate the nav elements. By default, images use display: inline-block; which was adding that unnecessary white space above the image.

#wrapper img {
    margin: 0;
    padding: 0;
    display: block;
}

Hope this solves your issues! Let me know if you have any questions.

Upvotes: 1

Related Questions