當瀏覽器很小時，標題不會完全左移

Question

我在製作菜單。在我目前的實現中，當我縮小瀏覽器時，標題內容不會完全左移。我怎樣才能更好地製作CSS樣式，以便在用戶縮小瀏覽器時完全移動到左側。

我目前的代碼如下。

.header-container 
    .header 
    .logo 
     %img{:src => 'assets/logo.png'} 
    .menu 
     %ul 
     %li 
      %a{:href => '#'} Home 
     %li 
      %a{:href => '#'} Features 
     %li 
      %a{:href => '#'} Pricing 
     %li 
      %a{:href => '#'} Team 
     %li 
      %a{:href => '#'} Support 

這裏是我的SCSS

.header-container { 
width: 100%; 
height: 5%; 
background: url(menubg.jpg) no-repeat; 

.header { 
    width: 70%; 
    margin: 0 auto; 
    padding: 2%; 
    border: 1px solid red; 

    img { 
     float: left; 
    } 

    ul { 
     border: 1px solid green; 
     //min-width 
     li { 
      float: left; 
      border: 1px solid blue; 
      margin-right: 2%; 
     } 
    } 
} 
} 

Answer 1

你有沒有聽說過的media query？