How do you stop your website from reacting to cropping

Question

on http://starwars.ea.com/starwars/battlefront/news/supremacy-mode-all-out-galactic-conquest when you crop the page up it doesnt react and move all of your content! How do you do that?

here is what I tried:

.nav { 
    display:block; 
    min-width:100%; 
    text-align: left; 
    position:fixed; 
    top:0; left:0; 
    list-style-type:none; 
    z-index:1000; 
    margin:0 auto; 
    background: -webkit-linear-gradient(top left, #3c8dbc 0%, #307196 100%);
    background: linear-gradient(to bottom right, #3c8dbc 0%, #307196 100%);
    color:#A3A3A3; 
    height:10%; 
    font-weight:lighter; 
    overflow:hidden; 
} 

.nav li { 
    display: inline-block; 
    margin:1%; 
    height:3%; 
    list-style-type:none; 
    color:#A3A3A3; 
} 
.nav ul{ 
    list-style-type:none;
} 
.nav ul li{ 
    list-style-type:none; color:white; 
}