CSS定位/大小

Question

我在我的css中使用@media all and (max-width: 600px) {}来获取响应式菜单，事实是它没有正确显示。

我希望橙色填充绿色空间..当然，将绿色空间转为透明。基本上它只是一个尺寸/位置问题。

CSS：

@media all and (max-width: 600px) {

  .example-header .container { 
     width: auto; 
     height:auto; 
     margin:0 auto;
     padding:auto;
  }
  /*Zwarte  MENU balk */
  a.menu-link { 
     display: block; 
     color: #fff; 
     background-color: #333;  
     text-decoration: none; 
     padding: 19px 10px; 
     width:auto; 
     height:auto; 
     margin:0 auto;
     padding:auto;
     margin-bottom:2em;
  }
  .menu { 
     border-top: 10px solid #333;
     border-bottom:10px solid #333;     
     height:13.2em; 
     margin:0 auto;
     padding:auto;
     width:100%;
     background-color:blue;
  }  
  .menu ul { 
     width:auto; 
     height:auto;  
     margin:0 auto;
     padding:auto;
  }
  .menu > ul { 
     height:auto;   
     margin-top:; 
     background-color:TRANSPARANT;
  }
  .menu li, .menu > ul > li { 
     width:100%;
     height:auto; 
     margin:0 auto;
     padding:0px;
     background-color:green;
  }  
  .menu li a { 
     color: #000;
     display: inline; 
     border-bottom: 1px solid #333; 
     position: relative; 
     height:auto; 
     margin:0 auto;
     padding:auto;
     background-color:orange;
  }
}

Answer 1

它看起来像与填充相关的问题，尝试将其设置为0而不是.menu ul的自动。 HTML会有所帮助。

Answer 2

我的猜测是锚元素＆＃39;应该是display: block;而不是display: inline;。可能他们的保证金也应该只是0而不是0 auto

没有HTML就无法说清楚。