Javascript CSS：作为图像最大宽度函数的左边距比例

我有2个div和1个Img，带有以下CSS

#StageDiv {
    position: absolute;
    left: 50%;
    margin-left: -200px;
}

#LogoDiv {
    position: absolute;
    margin-top: 135px;
    left: 50%;
    margin-left: -500px;
}

#logoimg {
    /* max-width: 75%; /* */
    width: 1000px; /* */  
}

在#logoimg的内部，我想使用

最大宽度：75%

并留有

空白：

的#LogoDiv和#StageDiv在变化时是#logoimg的函数

这在纯CSS中是可能的，还是必须在调整大小时在javascript中执行？（不确定当前实际的函数调用是什么，但我相信我的好友google会知道）我认为从长远来看，我很可能不得不使用javascript事件来扩展我的kineticjs阶段，但我想知道是否有一些CSS向导来完成第一部分

想法

编辑：

---

如果您可以为整个徽标创建一个包装div，您仍然会对CSS解决方案感兴趣

：

<div id="logo">
  <div id="StageDiv">...</div>
  <div id="LogoDiv">
    <img id="logoimg" src="..." />
  </div>
</div>

而其他元素的定位也变得更加容易：

#LogoDiv {
    top: 135px;
    position: absolute;
}

#StageDiv {
    text-align: center;
}

#logoimg {
    width: 100%;
}

margin:auto

和

text align:center

一起提供了您想要的自动边距

更新小提琴：

---

不过，正如您在问题上所说，画布需要缩放。

margin:auto非常好，完全忘记了
#logo {
    width: 1000px;
    max-width: 75%;
    margin: auto;
    position: relative;
}

#LogoDiv {
    top: 135px;
    position: absolute;
}

#StageDiv {
    text-align: center;
}

#logoimg {
    width: 100%;
}