2

複数の要素が単純になると

position:absolute;
bottom:0;

複数の要素をオーバーレイするため、役に立ちません

ここに私の試みのフィドルがあります:http://jsfiddle.net/7uYUP/ (右と下に浮かびたいのは.interaction要素です。今は右にしか浮かびません)

私はJSに頼る必要がないことを望んでいました..

4

2 に答える 2

2

問題は、緑色のボックスと黄色のボックスの高さが異なることです (10pt と 40pt)。あなたはそれを調整することができますmargin-top

.interaction{
   height:40pt;
   width:100pt;
   background-color:yellow;
   float:right;
   border: 1pt solid blue;
   margin-top:-32pt;
} 

http://jsfiddle.net/7uYUP/2/

于 2013-01-18T01:17:38.927 に答える
0
<body>

<div id="container"><div>

    <div class="interaction leftalign">
    </div>

    <div class="interaction">
    </div>  

</div></div>  

</body>  



 body{
      background-color:red;
    }

    #container{
     position:absolute;
      height:10pt;
      width:100%;
      background-color:green;
     bottom:0;
    } 

    #container > div {
      position:relative;
      height:100%;
    }  

    .interaction{
    height:40pt;
    width:100pt;
    background-color:yellow;
    float:right;
    border: 1pt solid blue;
    }  

    .interaction.leftalign {
      float:left;
    }
于 2013-01-18T03:54:02.007 に答える