导航边距/填充

时间:2012-11-16 04:48:24

标签: css nav

我有这个Jsfiddle:

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

我正试图在2个html5导航之间获得零距离

PHP示例:

    <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>

以下是我想要完成的示例图片:

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

1 个答案:

答案 0 :(得分:1)

你只需要添加display:block;到用于分隔导航元素的图像标记。默认情况下,图像使用display:inline-block;这是在图像上方添加了不必要的空白区域。

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

希望这能解决您的问题!如果您有任何问题,请告诉我。