在調整屏幕大小時縮小菜單（div）

Question

我在網站上有一個菜單：http://bit.ly/18zG5i7。如果窗口大小變小，我試圖縮小菜單的大小。

CSS

#menu_wrap 
{ 
    max-width: 100%; 
    position: fixed; 
    top:50%; 
    width: 100%; 
    display: inline-block; 
    bottom:0%; 
    left:2%; 
    z-index: 500; 
} 

#menu 
{ 
    background: #FFD700; 
    border-color:#000000; 
    width: 180px; 
} 

HTML

<div id="menu_wrap"> 
    <div id="menu"> 
     <ul id="navbar"> 
      <li><a href="#"> Home </a></li> 
      <li><a href="#"> About </a></li> 
      <li><a href="#"> Contact </a></li> 
     </ul> 
    </div> 
</div> 

Answer 1

對於所有類型的屏幕更好的顯示效果（即電腦，手機，ipad公司等）要使用@media screen請參考link

由於網站不適合所有屏幕，您需要設置差異。屬性差異。屏幕。

Answer 2

製作一個max-height:100%;和一個min-height:auto;也用寬度做到這一點。