javascript - 在 CSS 中为 div 指定百分比（即宽度：25%）是否有用

Question

我注意到关于 div 的位置和尺寸的问题被问了很多，请注意：

但我发现很多——当然不是全部——对 div 的尺寸进行硬编码。我主要使用百分比，因为我更喜欢让我的 div 处于相对位置。我首先在我的css文件中指定宽度/高度百分比，如下所示

div #menu {
   width: 75%;
   min-width: 75%;
}

但后来不得不像这样用jQuery强制最小宽度：

function onload ()
{
   $( "#menu" ).css( "min-width", 0.75 * window.width() ) );
}

我觉得到处都在声明 CSS 代码有点白痴，所以我的问题是：我是否应该费心在 CSS 样式表中指定 width/min-width 属性，还是有更好的方法来处理这些情况。

这是一个jsfiddle 示例，它说明了我遇到的问题。

score 1 · Accepted Answer

一些问题：

您的 CSS 隐含地依赖<body>来拉伸到窗口的大小。事情不是这样运作的。你需要一个明确的规则：
```
body, html { width: 100%; height: 100%; padding: 0; }
```
你的选择器是错误的。“div #A”中的空格应该被删除；事实上，“div”也应该如此。当通过“id”选择时，您只需要“id”，除非您正在为动态小部件进行某种限定（例如“body.touch #foo”以仅在触摸屏设备上应用样式）。
在 jsfiddle 中，您不提供整个 HTML 标记。该工具会为您做到这一点。您在 HTML 面板中放入的只是<body>内容。

这是您的代码的固定版本。

score 0 · Accepted Answer

感谢Pointy的建议，我找到了问题所在。我在div #A {...}应该使用的时候使用#A {...}。之后，我还用这条线将身体拉伸到 100%：

body {
   margin: 0px;
   height: 100%;
   min-height: 100%;
   min-width: 100%;
}

然后它按预期工作。在这里看到jsfiddle

2 回答 2