影响其他导航元素的导航 div答案

【问题标题】：Navigation Div Affecting Other Nav Elements影响其他导航元素的导航 div
【发布时间】：2014-04-14 13:40:58
【问题描述】：

我有几个 div 元素充当主导航。当页面处于活动状态时，我为每个页面设置了一个单独的 div 元素，以便 div 的高度更高。由于某种原因，这似乎会影响页面上其他 div 的行高/位置。

这是我的 SASS

#neo_mainnav {  /* Main navigation */
        position: fixed;
        bottom: 35px;
        width: 480px;

        .nav_text {
            font: 14pt Arial, Helvetica, sans-serif;
            text-align: center;
            vertical-align: middle;
            line-height: 35px;
        }

        #video_nav {
            float: left;
            margin-right: 10px;
            width: 112.50px;
            height: 35px;
            background: #66a9c6;
        }

        #video_nav_active {
            float: left;
            margin-right: 10px;
            width: 112.50px;
            height: 50px;
            background: #66a9c6;
        }

        #gallery_nav {
            float: left;
            margin-right: 10px; 
            width: 112.50px;
            height: 35px;
            background: #f0a262;
        }

        #gallery_nav_active {
            float: left;
            margin-right: 10px;
            width: 112.50px;
            height: 75px;
            background: #f0a262;
        }

        #floorplans_nav {
            float: left;
            margin-right: 10px;
            width: 112.50px;
            height: 35px;
            background: #66a9c6;
        }

        #floorplans_nav_active {
            float: left;
            margin-right: 10px;
            width: 112.50px;
            height: 75px;
            background: #66a9c6;
        }

        #contact_nav {
            float: left;
            width: 112.50px;
            height: 35px;
            background: #f0a262;
        }

        #contact_nav_active {
            float: left;
            width: 112.50px;
            height: 35px;
            background: #f0a262;
        }
    }   /* Main navigation end */

HTML 可以在这里看到http://jsfiddle.net/MQcGF/

整个页面可以在这里查看http://www.neoscapelabs.com/projects/469seventh/gallery.php

【问题讨论】：

请同时发布您的相关 HTML。
我的错误，我添加了一个 JSFiddle 到我的 HTML。也可以在我下面链接的网站上查看。

标签： html navigation sass css

【解决方案1】：

我最近遇到了类似的问题，我通过将（更高的）z-index 分配给“活动”状态/类来解决它。它对我有用。以防万一，为了避免和我一样的挣扎；请记住，z-indexing 仅适用于定位元素。

【讨论】：