如何使用css3 calc设置div的'left'属性?

Mar*_*cel 18 css3

我试图在一个确切的位置设置div的left属性,具体取决于其父级的宽度.

具体来说,我希望'left'属性为其父宽度 - 350px.

我试图像这样使用css3的计算(左:calc(100% - 350px))无济于事.这可能是因为100%正在查看左侧属性而不是父级宽度...

这有可能或我做错了什么?

谢谢

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

    // code 

</div>
Run Code Online (Sandbox Code Playgroud)

然后在我的CSS中:

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

Pas*_*rby 23

它应该工作(在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);
Run Code Online (Sandbox Code Playgroud)