Question

我有几个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

Answer 1

我最近遇到了类似的问题，我通过将（更高的）z-index分配给'active'状态/类来解决它。它对我有用。以防万一，为了避免同样的斗争;请记住，z-indexing仅适用于定位元素。

导航Div影响其他导航元素

1 个答案: