CSS - Leave a minimum distance between two elements 'fixed'

Navigation
3

I need to leave a minimum distance between two fixed position elements (the top and the bottom). The problem occurs when you apply zoom-in to the page, the two elements are virtually in place, and the purpose is to make the central content of the page visible.

CSS code for the fixed menu (top): 

div#menu {
    position:fixed;
    z-index:1;
    top:0;
    width:100%;
    height:53px;
    white-space:nowrap;
}

Fixed footer CSS code: 

table#rodape {
    position:fixed;
    z-index:1;
    bottom:0px;
    width:100%;
    height:70px;
    padding-top:5px;
    padding-bottom:5px;
    overflow:hidden;
}

Is there any way to do it in CSS? What solution can be applied and whether I will have to resort to using jQuery.

    
asked by anonymous 27.12.2014 / 00:24

1 answer

2

I believe there are several ways to solve this problem, I've done some testing here with your code. Testing and using media queries helped solve the problem.

The point is that you need to find the breakpoint of unwanted behavior, set it up in the media query so that the Layout fits during Zoom-in. 

   @media screen and (max-width: /*seu breakpoint*/){
        div#menu {
            /*sua adaptação*/
        }
    }

I hope I have helped. A Hug

    
27.12.2014 / 05:43
Android Development Standards PHP MYSQLi Array no select html