我正在制作菜单。在我当前的实现中,当我缩小浏览器时,标题内容不会完全向左移动。如何使 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%;
}
}
}
}