How to set the 'left' property of my div u

2019-04-18 07:41发布

I am trying to set the left property of a div in an exact location depending on the width of its parent.

Specifically I want the 'left' property to be its parent width - 350px.

I am trying to use css3's calc like this (left: calc(100% - 350px)) to no avail. This probably is because 100% is looking at the left property instead of the parent's width...

Is this possible at all or what am I doing wrong?

Thanks

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

    // code 

</div>

Then in my css:

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

标签: css3
3条回答
放荡不羁爱自由
2楼-- · 2019-04-18 07:49

It should work (on Chrome/Safari/Firefox/IE9+): http://jsfiddle.net/GXbJT/

According to Can I Use, Opera doesn't support it. And vendor-specific prefix is still required for WebKit-based browsers:

left:-webkit-calc(100% - 350px);
left:-moz-calc(100% - 350px);
left:calc(100% - 350px);
查看更多
ゆ 、 Hurt°
3楼-- · 2019-04-18 07:55

I changed the left property to width, just check it.

 #login5 {
    position: absolute;
    width: 260px;
    width: calc(100% - 350px);
    background-color: rgba(50, 50, 50, 0.6);
    padding: 20px;
    }
查看更多
霸刀☆藐视天下
4楼-- · 2019-04-18 07:57

Test with:

transform: translateX(25px);

and you move your tag to the right, or

transform: translateX(-25px);

and you move to the left.

查看更多
登录 后发表回答