Css меню рушится, когда окно сведено к минимуму

Question

У меня есть меню css, которое проходит через страницу, и у меня есть несколько блоков, которые пересекаются, я хочу, чтобы, когда окно сведено к минимуму, меню остается неизменным и не минимизирует

является то, что он выглядит, когда окно минимизировано разве

является то, что происходит, когда страница свернута, я хочу, чтобы меню просто урезается и не реформа. Кроме того, я не могу понять, как сделать блоки меню (Home, Таблица ...), чтобы перейти к центру страницы, они остаются на стороне

вот мой CSS код

@charset "UTF-8"; 
/* CSS Document */ 


body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input,  textarea, blockquote { 
margin: 0; padding: 0; border: 0; 

} 


body { 
font-family: Brixton , sans-serif; font-size: 22px; line-height: 0px; 
// controls the text size, color, font 
} 

nav ul ul { 
display: none; 
//sets menu dislpay setting 
} 

nav ul li:hover > ul { 
    display: block; 
    //displays the block under the main tabs in the menu 
} 


nav ul { 
background: #efefef; 
background: linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); 
box-shadow: 0px 0px 9px rgba(0,0,0,0.15); 
//change menu background 
padding: 0 20px; 
list-style: none; 
position: relative; 


} 
nav ul:after { 
    content: ""; clear: both; display: block; 
    //displays the background 
} 

nav ul li { 
    float:left; 
    //decides which side the menu is on 
} 
    nav ul li:hover { 
     background: #4b545f; 
     background: linear-gradient(top, #4f5964 0%, #5f6975 40%); 
     background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%); 
     background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%); 
     //changes the color of the menu when hovered over 
    } 
     nav ul li:hover a { 
      color: #fff; 
     } 

    nav ul li a { 
     display: block; padding: 25px 53px; 

     color: #007FFF; text-decoration: none; 
    } 


nav ul ul { 
    background: #5f6975; border-radius: 0px; padding: 0; 
    position: absolute; top: 100%; 
} 
    nav ul ul li { 
     float: none; 
     border-top: 1px solid #6b727c; 
     border-bottom: 1px solid #575f6a; position: relative; 
    } 

Answer 1

Если вы хотите, чтобы он всегда был одним и тем же, тогда вам нужно будет указать ширину элемента nav.

nav { width : 960px; } 

Это должно остановить его.