CSS宽度100％不起作用

Question

我的导航栏设置为宽度100％。它显示完美，但问题是当它被缩放时，右侧会留下一个空间。您可以在http://jsfiddle.net/ShNtf/查看工作示例 以下是我的CSS代码： -

.nav-container{
    width:100%;
    color:#fff;
    background:#000;
}
.nav-contained{
    min-width:350px;
}
}
body{
    padding:0;
    margin:0;
}

Answer 1

假设您想要保持最小宽度，请将其添加到容器中，它将起作用：

.nav-container{
  width:100%;
  color:#fff;
  background-color:#000;
  min-width:350px;
}

Answer 2

<强>问题：

当可以看到水平滚动条时，背景颜色不会填充浏览器宽度。

<强>解决方案：

我将background-color定义从.nav-container移至.nav-contained，取得了成功。

.nav-container {
    width:100%;
}
.nav-contained {
    min-width:350px;
    background:#000;
    color:#fff;
}

http://jsfiddle.net/ShNtf/7/

Answer 3

这是因为最小宽度。放大时，350px会“倍增”，如果它超过外部容器宽度，它会变宽并显示滚动条。

删除该最小宽度，使单词在缩放后分成多行。