0

私は絶対に配置された要素を次のようにしたいと思います:

  1. 常にコンテナー要素の下部に配置されます。
  2. コンテナ要素全体にまたがります。
  3. コンテナ要素のパディングをまたがらないでください。

コンテナ div には%ベース幅があります。

ここで私の問題を見ることができます: http://jsfiddle.net/vTuTv/2/

.container {
  min-height: 200px; 
  width: 50%;
  background-color: #3e3e00;
  position: relative;
  padding-left: 15px;
  padding-right: 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.line { 
  background-color: #003e3e;
  position: absolute;
  bottom: 0;
  height: 22px;
  width: 100%;   
}
<div class="container">
  <div class="line"></div>
</div>

明らかに、要素が絶対に配置されていない場合はbox-sizing、親要素で使用できます。

4

2 に答える 2

9

そのために使用しないでくださいwidth: 100%。次のコードは作業を行います。

jsFiddle デモ

.line { 
    position: absolute;
    bottom: 0;
    height: 22px;
    left: 15px;
    right: 15px;    
}
于 2013-09-11T20:04:47.760 に答える
1

現時点では発生していませんが、右に引っ張る必要があります。そのためには、次を追加します。

left: 0;

http://jsfiddle.net/WhK5W/1/

于 2013-09-11T20:11:31.393 に答える