親の幅に応じて、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);