css - 如何使用 css3 calc 设置我的 div 的 'left' 属性？

Question

我正在尝试根据其父级的宽度将 div 的左侧属性设置在一个确切的位置。

具体来说，我希望“左”属性为其父级宽度 - 350px。

我正在尝试像这样使用 css3 的 calc(左:calc(100% - 350px))但没有用。这可能是因为 100% 正在查看左侧属性而不是父级的宽度...

这完全有可能还是我做错了什么？

谢谢

<div id="login5" class="login">
    <h3>Login</h3>

    // code 

</div>

然后在我的 CSS 中:

#login5 {
    position: absolute;
    width: 260px;
    left: calc(100% - 350px);
    background-color: rgba(50, 50, 50, 0.6);
    padding: 20px;
    }

Answer 1

它应该可以工作(在 Chrome/Safari/Firefox/IE9+ 上):http://jsfiddle.net/GXbJT/

根据 Can I Use , Opera 不支持。基于 WebKit 的浏览器仍然需要特定于供应商的前缀:

left:-webkit-calc(100% - 350px);
left:-moz-calc(100% - 350px);
left:calc(100% - 350px);