Html 边缘顶部的宽度变小

我有一个带有边距顶部（相对于页面顶部）的框，它随着浏览器窗口（使用vw）而变小。
但是页面的标题（固定且在不同的z索引中）受到最小宽度的限制，因此当它达到1000px时，我需要框边距顶部停止变小并开始变大。。。与窗口越小一样，顶部边距越大…
这是盒子。。。现在，我需要创建一个@media屏幕和（最大宽度：1000px），其中显示高度相对于大众变得更大

#box {
position: relative;
float: left;
width: 100%;
height: auto;
min-height: 350px;
margin-top: 5vw;
}

---

你可以使用

标题{
背景：黑色；
高度：50px；
宽度：100%；
}
主要{
背景：绿色；
利润率最高：10vw；
高度：100vh；
}
@介质（最大宽度：768px）{
主要{
利润上限：计算（150px-10vw）；
}
}

这就是我现在正在尝试的。。。但是我需要做calc（50px*1vw），它给了我无效的属性值…把你在我创建的fiddle中尝试做的事情发布到这里不需要，谢谢，我像你说的那样使用calc（150px-10vw），然后搜索行为正确的值，它工作正常！我使用了calc（100px-5vw）；