Search code examples
dotnetnuketwitter-bootstrap-3dotnetnuke-7

How to avoid that a fixed bootstrap nav obscures the DNN control bar?

I am using bootstrap 3.0 nav in DNN with the navbar-fixed-top CSS class (I would not have this problem with navbar-static-top, but then the navbar disappears when one scrolls the page). When I log into DNN (as admin) then DNN will also produce a fixed navbar with admin specific menus. But now my bootstrap nav obscures the DNN control bar.

How can I adjust this, e.g. by applying a different style to either the nav bar or the DNN menu in admin mode?

If I put the Navbar into an .ascx, can I detect if I am in admin mode inside the .ascx?

Solution

  • Try using this CSS

    #ControlBar {
        height: 53px !important;
}

.navbar-fixed-top.admin {
        top: 53px;
        z-index: 9;
}

    and this JavaScript 

    $(function() {
    if ($('form').hasClass('showControlBar')) $('.navbar-fixed-top').addClass('admin');  
});