CSS3 Calc を使用して div の 'left' プロパティを設定するにはどうすればいいですか? 質問する

CSS3 Calc を使用して div の 'left' プロパティを設定するにはどうすればいいですか? 質問する

親の幅に応じて、div の left プロパティを正確な位置に設定しようとしています。

具体的には、「left」プロパティを親の幅である 350 px にします。

私は CSS3 の calc を次のように使用しようとしています (left: calc(100% - 350px)) が、うまくいきません。これはおそらく、100% が親の幅ではなく left プロパティを参照しているためです...

これは可能なのでしょうか、それとも私が何を間違っているのでしょうか?

ありがとう

<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;
    }

ベストアンサー1

動作するはずです (Chrome/Safari/Firefox/IE9+):http://jsfiddle.net/GXbJT/

によると使ってもいいですかOpera はこれをサポートしていません。また、WebKit ベースのブラウザではベンダー固有のプレフィックスが依然として必要です。

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

おすすめ記事